javascript - 点击dataTable的复选框,改变后面的属性
PHP中文网
PHP中文网 2017-04-11 10:10:21
[JavaScript讨论组]

点击前面的复选,改变后面文本框的disable值

或者怎么可以点击获取点击行的索引值

求教大神

生成表格代码是这样的


复选框 一级 二级 输入框
PHP中文网
PHP中文网

认证0级讲师

全部回复(4)
PHP中文网

直接上代码

$("#example tbody").on("click","tr",function(){
      var tr = $(this);
      var index = tr.index();
      tr.find("input").prop("disabled",true);
})
PHP中文网
  1. 给前面的单选框给一个自定义属性 data-xxx ,xxx 可以指向后面input的id,这样监听哪个框选中,就可以读取它的这个自定义属性,而且读取的值又是后面的input的id,方便选中操作,如果是很多行,不需要给id的话,那就用class也行,只是要筛选下,总之就是用自定义属性和后面的框耦合起来,自定义属性读取和内置属性的读取注意是不太一样的哦;

  2. 如果什么也不想做,那么其实就是监听选中事件,然后利用选择器选择这个单选框后面的input框,添加或者删除disable属性。

巴扎黑

DataTable有一个createdRow回调

$('table').DataTable({
.....
createdRow: function( row, data, dataIndex ) {
    $(':checkbox', row).on('click', function(){
        $(':text', row).prop('disabled', this.checked);
    }).triggerHandler('click'); //这是加载之后对input做初始的disabled
}

});
PHP中文网

$(this)就是当前tr,你再操作当前tr里对应的th就可以了

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号