javascript - 点击dataTable的复选框,改变后面的属性
本文介绍了javascript - 点击dataTable的复选框,改变后面的属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
点击前面的复选,改变后面文本框的disable值
或者怎么可以点击获取点击行的索引值
求教大神
生成表格代码是这样的
<body>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>复选框</th>
<th>一级</th>
<th>二级</th>
<th>输入框</th>
</tr>
</thead>
</table>
<script>
var data=[
{"online":"false","first":"政府办公","second":"公积金","info":""},
{"online":"true","first":"政府办公","second":"社保","info":""}
];
var table=$("#example").DataTable({
"data":data,
"columns":[
{"data":"online"},
{"data":"first"},
{"data":"second"},
{"data":"info"}
],
"columnDefs":[
{
"render":function(data,type,row){
if(row.online=="true"){
return "<input type='checkbox' checked/>"
}else{
return "<input type='checkbox'/>"
}
},
"targets":0
},
{
"render":function(data,type,row){
if(row.online=="true"){
return "<input type='text'/>"
}else{
return "<input type='text' disabled/>"
}
},
"targets":3
}
]
});
$("#example tbody").on("click","tr",function(){
//如何得到选中行的索引
})
</script>
</body>
解决方案
直接上代码
$("#example tbody").on("click","tr",function(){
var tr = $(this);
var index = tr.index();
tr.find("input").prop("disabled",true);
})
这篇关于javascript - 点击dataTable的复选框,改变后面的属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文