gpt4 book ai didi

jquery - 测试简单复选框功能的 jquery 更改

转载 作者:行者123 更新时间:2023-11-28 20:21:00 26 4
gpt4 key购买 nike

首先,我只想说下面的代码在现实中是有效的。它只是在 Jasmine 规范中失败了。功能非常简单。选择具有ID“Check_all”的复选框时,还选择所有其他复选框。

当我运行测试时,包括 expect #check_all 在内的所有内容都按预期通过。我无法理解为什么我的所有期望都没有通过。有什么建议吗?

功能:

window.check_all = () ->
$('#check_all').change(->
if $('#check_all').is(':checked')
$('.checkbox').attr('checked', 'checked')
else
$('.checkbox').removeAttr('checked')
)
$(check_all)

测试:

describe 'checkbox', ->
beforeEach ->
loadFixtures 'checkbox'
describe 'check_all', ->
it 'checks all the checkboxes if check_all is checked', ->
expect($('#check_all').is(':checked')).toBeFalsy()
expect($('#question_1').is(':checked')).toBeFalsy()
expect($('#question_2').is(':checked')).toBeFalsy()
expect($('#question_3').is(':checked')).toBeFalsy()
expect($('#question_4').is(':checked')).toBeFalsy()
expect($('#question_5').is(':checked')).toBeFalsy()

$('#check_all').attr('checked', 'checked')
$('#check_all').change()

expect($('#check_all').is(':checked')).toBeTruthy()
expect($('#question_1').is(':checked')).toBeTruthy()
expect($('#question_2').is(':checked')).toBeTruthy()
expect($('#question_3').is(':checked')).toBeTruthy()
expect($('#question_4').is(':checked')).toBeTruthy()
expect($('#question_5').is(':checked')).toBeTruthy()

夹具:

<p class="small gray"><input type="checkbox" name="check_all" id="check_all"> Select All</p>
<form accept-charset="UTF-8" action="" method="post">
<ul class="library_questions">
<li>
<input class="checkbox" id="question_1" name="question[]" type="checkbox" value="1"/>
Template Q1
</li>
<li>
<input class="checkbox" id="question_2" name="question[]" type="checkbox" value="2"/>
Template Q2
</li>
<li>
<input class="checkbox" id="question_3" name="question[]" type="checkbox" value="3"/>
Template Q3
</li>
<li>
<input class="checkbox" id="question_4" name="question[]" type="checkbox" value="4"/>
Template Q4
</li>
<li>
<input class="checkbox" id="question_5" name="question[]" type="checkbox" value="5"/>
Instructions
</li>
</ul>
<input class="purple submit_button" name="commit" type="submit" value="Submit"/>
</form>

最佳答案

您正在运行 check_all来自 $函数,这意味着它在文档就绪事件之后运行。我猜你的测试运行得更快,这就是触发 change 的原因事件不影响复选框。所以,要么:

  1. 将您的测试放在 $ 中包装器,或
  2. 放入定义check_all 的脚本在您的页面末尾 <body> .那么你不需要使用 $ wrapper 。

第三种选择是绑定(bind) change #check_all 的祖先事件处理程序反而。例如,

$(document).on('change', '#check_all', -> ...)

(在 jQuery 1.7 之前,您将使用 live 而不是 on。)这样,即使您的脚本从 <head> 运行,您仍然不需要 $包装器。

关于jquery - 测试简单复选框功能的 jquery 更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9847418/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com