在此行上设置输入的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/

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