在JavaScript中压倒一切的复选框使用jQuery [英] Overriding check box in JavaScript with jQuery
问题描述
帮助单元测试复选框行为。我有这个网页：
Help with unit testing checkbox behavior. I have this page:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function() {
$('<div><input type="checkbox" name="makeHidden" id="makeHidden" checked="checked" />Make Hidden</div>').appendTo('body');
$('<div id="displayer" style="display:none;">Was Hidden</div>').appendTo('body');
$('#makeHidden').click(function() {
var isChecked = $(this).is(':checked');
if (isChecked) {
$('#displayer').hide();
}
else {
$('#displayer').show();
}
return false;
});
});
</script>
</head>
<body>
</body>
</html>
这不工作是因为 return false; code>。如果我删除它它工作伟大。问题是如果我把单击函数拉出到它自己的函数和单元测试它与qunit它将不工作没有 return false;
使用@ patrick的回答我的结果是：
Using @patrick's answer my results are:
Firefox：
- 玩具手动测试 - 好。
- 单元测试 - 好。
- 生产应用程序的手动测试 - 好。
Internet Explorer：
Internet Explorer:
- 玩具手动测试失败。
- 单元测试 - 好。
- 生产应用程序的手动测试失败。
Internet Explorer最初需要一次点击。
Internet Explorer requires initially, one-click. after that it requires two clicks.
我认为jQuery是抽象出浏览器？
I thought jQuery is to abstract away browsers?
在我的单元测试中，这是我对用户模拟复选框的方法：
In my unit tests this is how I am doing the check box simulation of a user:
$(':input[name=shipToNotActive]').removeAttr('checked');
$('#shipToNotActive').change();
以及：
$(':input[name=shipToNotActive]').attr('checked', 'checked');
$('#shipToNotActive').change();
推荐答案
/ code>而不是点击？
How about using change instead of click?
$('#makeHidden').change(function() {
var isChecked = $(this).is(':checked');
if (isChecked) {
$('#displayer').hide();
}
else {
$('#displayer').show();
}
return false;
});
return false; 因为事件由于发生了更改而触发。
The return false; won't be in the way since the event is fired as a result of the change having occurred.
这篇关于在JavaScript中压倒一切的复选框使用jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
