Can't seem to figure out why my javascript isn't working in IE and Chrome

Question

Question I have this js and for some reason it isn't working in IE or Chrome but, it does work in FF and help would be greatly appreciated.

Side note I need this to be a change function-- for some strange reason click function works in IE and Chrome but, in this situation I need it to be a change, also this a RubyRails application.

Here is my code ..

$(document).ready(function () {

    $('#emp_id').change(function () {
       var url = "/user/populate_form?emp_id=" + $(this).val();
       $.getJSON(url, function (data) {
            if (!(data.emp_first_name === undefined))
                $('#emp_first_name').val(data.emp_first_name);
            if (!(data.emp_last_name === undefined))
                $('#emp_last_name').val(data.emp_last_name);
            if ((data.error * 1) == 404) {
               alert("The employee ID entered was not found!");
               } else {
               window.confirm("Your employee ID was found please fill in the email(optional) and password fields then click the sign in button to register.");
               }
           });
       });
   });

I also tried this still didn't work in IE & Chrome

$(document).ready(function () {

    $('#emp_id').on('change', function () {
       var url = "/user/populate_form?emp_id=" + $(this).val();
       $.getJSON(url, function (data) {
            if (!(data.emp_first_name === undefined))
                $('#emp_first_name').val(data.emp_first_name);
            if (!(data.emp_last_name === undefined))
                $('#emp_last_name').val(data.emp_last_name);
            if ((data.error * 1) == 404) {
               alert("The employee ID entered was not found!");
               } else {
               window.confirm("Your employee ID was found please fill in the email(optional) and password fields then click the sign in button to register.");
               }
           });
       });
   });

Tried this as well still did not work in IE and Chrome

$(document).ready(function () {

    $('#emp_id').keyup('onchange', function () {
       var url = "/user/populate_form?emp_id=" + $(this).val();
       $.getJSON(url, function (data) {
            if (!(data.emp_first_name === undefined))
                $('#emp_first_name').val(data.emp_first_name);
            if (!(data.emp_last_name === undefined))
                $('#emp_last_name').val(data.emp_last_name);
            if ((data.error * 1) == 404) {
               alert("The employee ID entered was not found!");
               } else {
               window.confirm("Your employee ID was found please fill in the email(optional) and password fields then click the sign in button to register.");
               }
           });
       });
   });

Here is my view code

    <div class='row form-group'>
      <div class='col-xs-8 col-xs-offset-2 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4 col-lg-2 col-lg-offset-5 text-right'>
       <%= f.text_field :emp_id, tabindex: 1, id: 'emp_id', autofocus: true, placeholder: t( 'login_label' ), class: 'form-control' %>
      </div>
    </div>

    <div class='row form-group'>
      <div class='col-xs-8 col-xs-offset-2 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4 col-lg-2 col-lg-offset-5 text-right'>
       <%= f.text_field :emp_first_name, tabindex: 1, id: 'emp_first_name', autofocus: true, placeholder: t( 'login_label' ), class: 'form-control' %>
      </div>
    </div>

    <div class='row form-group'>
      <div class='col-xs-8 col-xs-offset-2 col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4 col-lg-2 col-lg-offset-5 text-right'>
       <%= f.text_field :emp_last_name, tabindex: 1, id: 'emp_last_name', autofocus: true, placeholder: t( 'login_label' ), class: 'form-control' %>
      </div>
    </div>

Answer 1

The jQuery Change event only triggers, when the input field loses focus.

EDIT:

$(document).ready(function () {

$('#emp_id').change(function () {
   var url = "/user/populate_form?emp_id=" + $(this).val();

   $.getJSON(url, function (data) {
        data = JSON.parse(data);

        if (data.emp_first_name !== undefined) {
            $('#emp_first_name').val(data.emp_first_name);
        }

        if (data.emp_last_name !== undefined) {
            $('#emp_last_name').val(data.emp_last_name);
        }

        if (parseInt(data.error) === 404) {
           alert("The employee ID entered was not found!");
        } else {
           window.confirm("Your employee ID was found please fill in the email(optional) and password fields then click the sign in button to register.");
        }
   });
});

EDIT #2: I think, there was a syntax error in my example code...

Answer 2

This should work for you:

$(document).ready(function() {
  $('#emp_id').keyup(function() {
    var url = "/user/populate_form?emp_id=" + $(this).val();
    $.getJSON(url, function (data) {
      if (typeof(data.emp_first_name) !== 'undefined')
        $('#emp_first_name').val(data.emp_first_name);

      if (typedof(data.emp_last_name) !== 'undefined')
        $('#emp_last_name').val(data.emp_last_name);

      if (parseInt(data.error) == 404) {
        alert("The employee ID entered was not found!");
      }
      else {
        window.confirm("Your employee ID was found please fill in the email(optional) and password fields then click the sign in button to register.");
      }
    });
  });
});

Answer 3

好吧，我知道了...我要做的就是将$（'＃emp_id'）。change（function（）{更改为$（'＃emp_id'）。blur（function（）{