使用jQuery覆盖JavaScript中的复选框

帮助unit testing复选框行为。 我有这个页面：

      $(function() { $('
Make Hidden
').appendTo('body'); $('
Was Hidden
').appendTo('body'); $('#makeHidden').click(function() { var isChecked = $(this).is(':checked'); if (isChecked) { $('#displayer').hide(); } else { $('#displayer').show(); } return false; }); });      

这不起作用，因为return false; 在单击处理程序中。 如果我删除它，它的效果很好。 问题是如果我将click函数拉出它自己的函数并用qunit对它进行unit testing，如果没有return false;则它将无法工作return false;

[编辑]使用@ patrick的答案我的结果是：

火狐：

• 手动测试玩具 – 好。
• unit testing – 很好。
• 生产应用程序的手动测试 – 很好。

IE浏览器：

• 手动测试玩具 – 失败。
• unit testing – 很好。
• 生产应用程序的手动测试 – 失败。

Internet Explorer首先需要单击一次。 之后需要两次点击。

我认为jQuery是抽象浏览器？

我是否必须覆盖解决方案的整个复选框行为？

在我的unit testing中，这是我如何进行用户的复选框模拟：

 $(':input[name=shipToNotActive]').removeAttr('checked'); $('#shipToNotActive').change(); 

并且：

 $(':input[name=shipToNotActive]').attr('checked', 'checked'); $('#shipToNotActive').change(); 

Answer 1

如何使用change而不是click ？

 $('#makeHidden').change(function() { var isChecked = $(this).is(':checked'); if (isChecked) { $('#displayer').hide(); } else { $('#displayer').show(); } return false; }); 

return false; 因为发生了变化而导致事件被触发，所以不会妨碍。

Answer 2

这是一个解决方法。

现在我的代码是这样的：

  if ($.browser.msie) { $('#makeHidden').change(function () { this.blur(); this.focus(); onCheckboxClicked(); }); } else { $('#makeHidden').change(function() { return onCheckboxClicked(); }); } 

我的所有测试包括手动玩具和手工制作都很好。

有人比这个黑客有更好的东西吗？

Answer 3

试试这个：

 $(function() { $('
Make Hidden
').appendTo('body'); $('
Was Hidden
').appendTo('body'); $('#makeHidden').click(function() { return onCheckboxClicked(this) } ); }); function onCheckboxClicked(el) { var isChecked = $(el).is(':checked'); if (isChecked) { $('#displayer').hide(); } else { $('#displayer').show(); } return false; }