jquery-1.9.1 fires change event twice on select in Chrome

Question

I can't seem to figure out why the change event fires twice for this select element:

<form name="contactform">
  <label for="requesttype">Request Type:</label>            
  <select name="requesttype" class="reqtype">
     <option value="1" selected>General Comment / Request</option>
     <option value="2">No Cost Services Quote</option>
  </select>
</form>

When using this jquery code:

$(function() {
    $(".reqtype").change(function(){
        alert($(".reqtype option:selected").val());
    })
});

I double-checked that the only place I am using the class "reqtype" is in the select element. Any help would be appreciated.

Answer 1

Had a similar problem and tried all the solutions I could find. The only one that worked for me was unbind before the change check (mentioned by DevPat above):

jQuery("#wfselect").unbind(); 
jQuery("#wfselect").change(function() { getWFDetail(); });

Answer 2

In situations like this using .unbind() before binding the event handler results in a clean JS. You can refer to jQuery documentation