Why jQuery's .change() event only fires on right-mouse click?

问题

I am having trouble with jquery's .change() event when I am modifying an input element. Supposedly, this event will fire every time I have live changes on the said element. But in my case it only fires after I have pressed the right-click button. Here are my codes on laravel framework:

HTML:

<div class="form-group">
    <label for="verifyPassword"><h4>Verify Password:</h4></label>
    {{ Form::password('password',array('class'=>'span3 form-control', 'id'=>'verify-password', 'placeholder'=>'Verify Password')) }}
</div>

JS:

$(document).ready(function(){
        $( "#verify-password" ).change(function() {
          alert( "Text Changed!" );
        });
});

Hope someone could help me find the mess and get me with perfect solutions. Thanks.

回答1:

For text fields, the change event is not fired until the element loses focus (and a change has been made to its' value).

From the API:

For select boxes, checkboxes, and radio buttons, the event is fired immediately when the user makes a selection with the mouse, but for the other element types the event is deferred until the element loses focus.

If you need to know when the value changes immediately, use keyup or keypress.

来源：https://stackoverflow.com/questions/24055587/why-jquerys-change-event-only-fires-on-right-mouse-click