Front-End-Seite HTML
<tr v-for="(log,index) in logList">
<!-- v-bind:value绑定 -->
<td><input name="ids" :value="log.logId" type="checkbox"></td>
</tr>
js-Code – Schleife, um den Wert des Kontrollkästchens zu erhalten
//获取复选框checkbox选中的个数
/*var size = $("input:checkbox:checked").length;
alert("size = "+ size);*/
//定义数组用来存储复选框的value
var checkedValueList = [];
//each() 方法为每个匹配元素规定要运行的函数,循环遍历,将复选框选中的value放到数组中
$("input:checkbox:checked").each(function(){
//alert($(this).val());
//将选中的checkbox的value放到数组中
checkedValueList.push($(this).val());
});
console.log("checkedValueList = " + checkedValueList);
Kontrollkästchen „Alles auswählen“, „Alles abwählen“, Funktion „Auswahl umkehren“.
// 全选功能
checkAll:function() {
// 将所有的name属性等于 'ids' 的input元素的checked设置为true(checkbox选中)
$("input[name='ids']").prop("checked",true);
console.log("选中个数 size = "+ $("input:checkbox:checked").length)
},
// 全不选功能
checkNoAll:function() {
// checked全设置为false
$("input[name='ids']").prop("checked",false);
console.log("选中个数 size = "+ $("input:checkbox:checked").length)
},
// 反选功能
reverseCheck:function() {
//循环
$("input[name='ids']").each(function(){
//选中的改为非选中,非选中的改为选中 prop函数,实现如果选中返回ture
if($(this).prop("checked")) {
$(this).prop("checked", false);
}else{
$(this).prop("checked", true);
}
});
//console.log("反选 - 选中个数 size = "+ $("input:checkbox:checked").length)
},
prop()
In jQuery 1.6 und späteren Versionen wird empfohlen , die Funktion zum Festlegen oder Abrufen vonchecked、selected、disabled
Eigenschaften wie zu verwenden . Auch andere Vorgänge, die mit prop() implementiert werden können, sollten so weit wie möglich die Funktion prop() verwenden