如何在編輯文本框時調用jQuery函數

Question

在我的代碼中有一個文本框被禁用。當用戶點擊編輯鉛筆圖標文本框啓用編輯的東西。當用戶編輯文本框時，它必須檢查編輯的值是否已經退出。爲此我調用了checkOwnerId方法。但是沒有任何呼叫進入該功能。

這是我的jQuery代碼

var parcel = $('#parcel_no').val(); 
     $('#pin-edit').click(function() { 
      $('#owner_id_txt').removeAttr("disabled"); 
      $("#pin-edit").hide(); 
      $("#save-pin").show(); 
      oldOwnerId = $('#owner_id_txt').val(); 
     }); 
     $('#save-pin').click(function() { 
      if ($("#owner_id_txt").val() == "") { 
       displayErrorMessage('Please enter owner Id'); 
       $("#owner_id_txt").focus(); 
       $('#owner_id_txt').val(oldOwnerId); 
       return; 
      } 


      $("#pin-edit").show(); 
      $('#owner_id_txt').attr("disabled", true) 
      $("#save-pin").hide(); 
      var data = { 'owner_id': $("#owner_id_txt").val(), 'parcel_no': parcel }; 
      BlockUI(); 
      var urlstring = "@Url.Content("~")Parcel/UpdateOwnerId"; 
      $.post(urlstring, data, function (result) { 
       UnblockUI(); 
       if (result.success == true) { 
        displaySuccessMessage('Owner Id updated successfully!'); 

       } 
       else { 
        displayErrorMessage('There was an error while updating Owner Id!'); 
       } 
      }); 

      $('#owner_id_txt').change(function() { 
//alert("Check Exist or Not"); 
         var data = { 'owner_id': $("#owner_id_txt").val() }; 
         var urlString = "@Url.Content("~")Parcel/CheckOwnerId"; 
         urlString = sanitize_url_path(urlString); 
         $.post(urlString, data, 
          function (result) { 
           if (result) { 
           displayErrorMessage("Owner Id already exists"); 
            $("#pin-edit").show(); 
            $('#owner_id_txt').attr("disabled", true); 
            $("#save-pin").hide(); 
           } 
          }); 
        }) 
     }); 

Answer 1

你的 '$（' ＃owner_id_txt '）。改變（函數（）{' 叫'（'＃save-pin'）。click（function（）{'所以一旦你輸入文本框就不會調用它，把函數放在它的外面，然後它會檢查這個值，參考下面的jsfiddle示例

code：JS

$(document).ready(function() { 
    $('#pin-edit').click(function() { 
     $('#owner_id_txt').removeAttr("disabled"); 
     $("#pin-edit").hide(); 
     $("#save-pin").show(); 
     oldOwnerId = $('#owner_id_txt').val(); 
    }); 
    $('#save-pin').click(function() { 
     if ($("#owner_id_txt").val() == "") { 
     $("#owner_id_txt").focus(); 
     $('#owner_id_txt').val(oldOwnerId); 
     return; 
     } 
     $("#pin-edit").show(); 
     $('#owner_id_txt').attr("disabled", true) 
     $("#save-pin").hide(); 
    }); 
    $('#owner_id_txt').change(function() {//alert("Check Exist or Not"); 
     console.log($(this).val()); 
    }); 
    $('#owner_id_txt').attr("disabled", true); 
}); 

代碼：HTML

<input type="text" id="owner_id_txt" > 
<div id="pin-edit">edit</div> 
<div id="save-pin">save</div> 

https://jsfiddle.net/pitchiahn/fr6gdeyd/

Answer 2

這可以使用jQuery的變化進行存檔：

$("'textboxid").change(function() { 
    // Check input($(this).val()) for validity here using ajax call 
});