(1)全选
HTML:<input type="checkbox" id="selectAllproduct" style="margin:8px" onclick="selectAll(this)">
Jquery:
function selectAll(a){
var type = a.checked; //选中:type=true; 取消选中:type=false
$("#mintable input[name='productbox']").each(function() {
$(this).prop("checked", type); //相关该被选中的内容全部同步选中
});
}
(2)获取多个被选中的复选框的值
HTML:以下的input被循环产生,多个input共用一个name="productbox"
<div><input type="checkbox" value="{{value.id}},{{value.name}}" name="productbox" class="productCheckbox">{{value.name}}</div>
Jquery:
function confirm(){
var productname = $("#productname").val();
$("#mintable input[name='productbox']").each(function(){
var obj = $(this);
if (obj.is(':checked')){
var id_name = obj[0].value.split(",");
//id_name = [value.id, value.name]
//选中的值可取出用于业务逻辑
document.getElementById("product_div").style.display = "none";
}
(3)div隐藏属性修改:此处不可用$("#product_div")这个方法获取div对象
HTML:<div id="product_div"></div>
JS:document.getElementById("product_div").style.display = "none";
document.getElementById("product_div").style.display = "block";
(4)获取复选框属性
<input type="checkbox" id="iszfy" style="margin:8px"/>
var var1 = $("#iszfy").prop("checked")
var var2 = $("#iszfy").is(":checked")
var var2 = document.getElementById("iszfy").checked
(5)设置复选框属性
<input type="checkbox" id="iszfy" style="margin:8px"/>
$("$iszfy").prop("checked", true);
$("#iszfy").prop("checked", false);
document.getElementById("iszfy").checked = true;
(6)input标签对象获取
<table id = "tbl">
<input type="checkbox" value="1" name="productbox" class="productCheckbox">
<input type="checkbox" value="2" name="productbox" class="productCheckbox">
<input type="checkbox" value="3" name="productbox" class="productCheckbox">
……
</table>
$("#tbl input[name="productbox"] ").each(function(){
var obj = $(this);
if (obj.is(":checked")){
//业务逻辑
}
});