@ Html.TextBoxFor Text geändert Ereignis

Question

Ich habe ein @Html.TextBoxFor wie folgt:

@Html.TextBoxFor(u => u.SomeProperty, new { @class = "jtb", @id = "TrajName", placeholder = "Traj Name" }) 

Nun, was ich erreichen will bin ich wissen will, wenn ein neuer Charakter auf dieses Feld zur gleichen Zeit hinzugefügt wird, ist es trat ein. Ich möchte zu dieser Zeit den Zustand eines Knopfes auf aktiv setzen. Ich versuchte blur und change Ereignis. Aber es wird nur ausgelöst, wenn sich der Fokus ändert.

$(document).ready(function() { 
    $('#TrajName').val(""); 
    $('#StartLocation').val("-Select Location-"); 
    $('#EndLocation').val("-Select Location-"); 

    document.getElementById("BtnAddTraj").disabled = true; 

    $("#TrajectoryName").blur(function() { 
     if ($('#TrajName').text != "") 
      document.getElementById("BtnAddTraj").disabled = false; 
     else 
      document.getElementById("BtnAddTraj").disabled = true; 
    }); 
}); 

Ich habe ein Szenario, in dem Benutzer direkt ausprobieren können auf den Button klicken, nachdem Sie einen Text eingeben (zB Cursor noch im Textfeld und Fokus nicht geändert).

Gibt es also ein Ereignis, das einen Live-Trigger gibt, wenn ein Charakter hinzugefügt wird, anstatt auf die Fokusänderung zu schießen?

Answer 1

Sie müssen einen Event-Handler an das JavaScript-Ereignis keyup binden.

Weiter, ich empfehle Ihnen, .prop für die Einstellung deaktiviert Eigenschaft zu verwenden.

Bitte versuchen Sie dies:

@Html.TextBoxFor(u => u.SomeProperty, new { @class = "jtb", @id = "TrajName", placeholder = "Traj Name" }) 

$("#TrajectoryName").keyup(function() { 
    if ($('#TrajName').val() != "") 
     $("#BtnAddTraj").prop('disabled',false); 
    else 
     $("#BtnAddTraj").prop('disabled',true); 
}); 

Eine andere Lösung ist es, die input Ereignis zum TrajectoryName Textbox auszulösen. Dies würde jedes Mal ausgelöst werden, wenn sich Ihre Eingabe ändert.

$("#TrajectoryName").on('input',function() { 
    if ($('#TrajName').val() != "") 
     $("#BtnAddTraj").prop('disabled',false); 
    else 
     $("#BtnAddTraj").prop('disabled',true); 
});