Javascript Jquery按钮选择一个div中的所有复选框,并在页面上选择所有
您好,我真的需要一些帮助,因为我无法让按钮选择.voltSiteResultContainer中的所有复选框 HTML示例:Javascript Jquery按钮选择一个div中的所有复选框,并在页面上选择所有,javascript,jquery,checkbox,Javascript,Jquery,Checkbox,您好,我真的需要一些帮助,因为我无法让按钮选择.voltSiteResultContainer中的所有复选框 HTML示例: <div class="pageContainer"> <input type="button" class="check" value="check all"> // want this button to check all on page <div class="voltSiteResultContainer"> <
<div class="pageContainer">
<input type="button" class="check" value="check all"> // want this button to check all on page
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all"> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
</div>
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all"> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.check:button').toggle(function(){
$('input:checkbox').attr('checked','checked');
$(this).val('uncheck all')
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
})
})
$(document).ready(function(){
$('.checkSite:button').toggle(function(){
.closest('.voltSiteResultContainer').find('input:checkbox').attr('checked','checked');
$(this).val('uncheck all')
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
})
})
//希望此按钮选中第页上的所有内容
//希望此按钮选中.voltSiteResultContainer中的所有内容
//希望此按钮选中.voltSiteResultContainer中的所有内容
当前Jquery:
<div class="pageContainer">
<input type="button" class="check" value="check all"> // want this button to check all on page
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all"> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
</div>
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all"> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
<input name="checkFile" type="checkbox" class="checkFile" value="1514583">
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.check:button').toggle(function(){
$('input:checkbox').attr('checked','checked');
$(this).val('uncheck all')
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
})
})
$(document).ready(function(){
$('.checkSite:button').toggle(function(){
.closest('.voltSiteResultContainer').find('input:checkbox').attr('checked','checked');
$(this).val('uncheck all')
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
})
})
$(文档).ready(函数(){
$('.check:button').toggle(函数(){
$('input:checkbox').attr('checked','checked');
$(this.val('uncheck all'))
},函数(){
$('input:checkbox')。removeAttr('checked');
$(this.val('check all');
})
})
$(文档).ready(函数(){
$('.checkSite:button')。切换(函数(){
.closest('.voltSiteResultContainer').find('input:checkbox').attr('checked','checked');
$(this.val('uncheck all'))
},函数(){
$('input:checkbox')。removeAttr('checked');
$(this.val('check all');
})
})
所以$('.check:button')可以工作,但是$('.checkSite:button')不能:(
提前感谢您为我提供的任何帮助:)
在第11行中添加$(this)
,并在HTML中添加缺少的
:
$(document).ready(function(){
$('.check:button').toggle(function(){
$('input:checkbox').attr('checked','checked');
$(this).val('uncheck all');
},function(){
$('input:checkbox').removeAttr('checked');
$(this).val('check all');
});
$('.checkSite:button').toggle(function(){
$(this).closest('.voltSiteResultContainer').find('input:checkbox').attr('checked','checked'); // HERE!!
$(this).val('uncheck all');
},function(){
$(this).closest('.voltSiteResultContainer').find('input:checkbox').removeAttr('checked');
$(this).val('check all');
});
});
固定HTML标记:
<div class="pageContainer">
<input type="button" class="check" value="check all" /> // want this button to check all on page
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all" /> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
</div>
</div>
<div class="voltSiteResultContainer">
<div class="checkWrap">
<input type="button" class="checkSite" value="check all" /> // want this button to check all within .voltSiteResultContainer
</div>
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
<input name="checkFile" type="checkbox" class="checkFile" value="1514583" />
</div>
//希望此按钮选中第页上的所有内容
//希望此按钮选中.voltSiteResultContainer中的所有内容
//希望此按钮选中.voltSiteResultContainer中的所有内容
谢谢Roko,非常感谢您的帮助,您必须在5分钟内完成回答。。。干杯人:)