jQuery技术:在此行上设置输入的attr

我有一个3行的表

Jquery当有人单击复选框时我想更改该行上2个输入的attr并使它们可编辑但如果有人单击另一行上的复选框,则必须禁用先前启用的输入并启用新的输入

这是我的想法,但它不起作用

  $("#table1 :checkbox").click(function(){ $(this).parent(":input[type='text']").attr('disabled',false); }); 

    parent(":input[type='text']")表示“如果它是一个带有text类型的输入元素,请给我父节点。这显然不是你想要的!你需要使用find

     $("#table1 :checkbox").click(function(){ $(this) .closest('tr') // find the parent row .find(":input[type='text']") // find text elements in that row .attr('disabled',false) // enable them .end() // go back to the row .siblings() // get its siblings .find(":input[type='text']") // find text elements in those rows .attr('disabled',true); // disable them }); 

    您可以观察所有复选框的更改,这将同时触发选择和取消选择。 如果选中,我们可以将disabled属性设置为空字符串以“启用”,如果取消选择为“禁用”以重新禁用输入:

     $('#table1 :checkbox').change(function() { $(this).closest('tr').find('input[type="text"]').attr('disabled', this.checked ? '' : 'disabled' ); }); 

    演示: http //jsfiddle.net/marcuswhybrow/8WtvK/

     $('#table1 input:checkbox').click(function() { var row = $(this).closest('tr'); row.find('input:text').attr('disabled', false); row.siblings().find('input:text').attr('disabled', true); }); 

    现场演示: http //jsfiddle.net/buAmd/

    我在演示中使用了无线电盒,因为这两个盒子不能同时检查。

      以上就是jQuery教程分享在此行上设置输入的attr相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/547948.html

      (0)
      上一篇 2021年1月13日
      下一篇 2021年1月13日

      精彩推荐