IE7 change event not being triggered

问题

Am I doing something wrong? Why isn't the click event registering on the first keydown?

http://jsfiddle.net/vol7ron/VJ5CX/

In the example,

Click the "Menu" to make sure it has focus
Use the arrow keys (up/down) to highlight an option
Use the spacebar to select the option

Notice how the change() event is not being called. Use the spacebar again to select the same option and notice it is working as it should.

I've tried:

using the blur/focus according to this question, but haven't had any luck
setting the checked attribute to false, to make sure the change event is triggered

Interesting Findings:

There isn't a problem when using a mouse (it triggers the change event on the first time, as expected)
The problem still occurs for the keydown, even after selecting with the mouse (run, click an option, hover to the option and use the keyboard).

Expected Results:

Using keyboard navigation (up/down arrows) and selecting with the spacebar, should trigger both the "keydown" and "click" log. It doesn't work on the initial keydown, but does every subsequent time. (Check Firefox for a working example)

回答1:

I was using blur/focus on the initial load. Apparently I needed the blur/focus inside the keydown event:

if (e.keyCode == 13 || e.keyCode == 32) {
   var cb = container.find('label.x-hover input:checkbox');

   cb.blur();             // <-- added
   cb.focus();            // <-- added
   cb.click();  
   updateLog('keydown');
   oTitle.focus();      
   return false;
}

回答2:

Try doing this. It happened with me as well. But i tried this, it helped. I am not sure whether this will work or not.

container
.find('input[type="checkbox"]')
.change(function(){
   var cb     = $(this);
   var sClass = "checked";

   if (cb.prop(sClass)) { 
       cb.parent('label').addClass(sClass); 
   } else { 
       cb.parent('label').removeClass(sClass); 
   }
   updateLog('click');        
   oTitle.focus();
})

;

来源：https://stackoverflow.com/questions/7664771/ie7-change-event-not-being-triggered

标签

jquery

internet-explorer-7