为什么我不能使用jQuery启用和取消选中元素？

Question

我想通过编辑此代码来启用并设置check = false？

if (confirm('This widget will be removed, ok?')) { 
    $(​'table tr input[type=hidden]').filter(function() { 
     return $(this).val()​​​​​ == widgetId; 
    }).siblings('input[type=checkbox]').attr({disabled: true, checked: true}); 

我尝试：

.siblings('input[type=checkbox]').removeAttr('disabled'); 

这。

.siblings('input[type=checkbox]').attr({disabled:false, checked: false}); 

但不成功

---

EDIT 1：

<table><colgroup><col title="process name"></colgroup> <tbody><tr><td><input name="rlv_mainservices$ctrl0$hf_id" id="rlv_mainservices_ctrl0_hf_id" value="91" type="hidden"> <input id="rlv_mainservices_ctrl0_chb_sys" name="rlv_mainservices$ctrl0$chb_sys" type="checkbox"> <span id="rlv_mainservices_ctrl0_lbl_main_sys">pro1</span> </td></tr></tbody></table><table><colgroup><col title="processname"> </colgroup><tbody><tr><td><input name="rlv_mainservices$ctrl1$hf_id" id="rlv_mainservices_ctrl1_hf_id" value="92" type="hidden"><input id="rlv_mainservices_ctrl1_chb_sys" name="rlv_mainservices$ctrl1$chb_sys" type="checkbox"> <span id="rlv_mainservices_ctrl1_lbl_main_sys">pro2</span> </td></tr></tbody></table> 

我想使输入类型= “复选框” 如果输入类型的值= “隐藏” 存在在相同的<td>等于li（小部件）的id。这个当用户点击关闭。

Answer 1

试试这个

$(​'table tr input[type="hidden"][value="'+widgetId+'"]') 
     .siblings(':checkbox').attr("disabled": false).attr("checked": false); 

Answer 2

尝试使用prop而不是attr： http://api.jquery.com/prop/

.siblings('input[type=checkbox]').prop({"disabled": false, "checked": false}); 

Answer 3

其实你可以用jQuery做到这一点。

要启用

$('#element').removeAttr('disabled'); 

要取消

$('#element').removeAttr('checked'); 

或者，即使它们合并

$('#element').removeAttr('disabled').removeAttr('checked'); 

---

以防万一，你操纵的属性就已经被加载后，那么它将不再可用属性来自jQuery 1.6。

如果使用这样后来，尝试.removeProp(propertyName)^{[docs here]}代替。

$('#element').removeProp('disabled').removeProp('checked'); 

更新

• 更新1：它的工作。检查demo here。

• 更新2：我也模拟操作和使用创造另一个.removeProp小提琴（），检查here

• 更新3：正常，检查this update。它与您的标记兼容，但是，您可能需要使用适当的选择器。但是，这会给你整个想法。

Answer 4

我想知道这是否是你想要做的事情。我不得不想出一些替代标记，并且我不知道widgetId来自哪里。但是，这是你所追求的效果吗？

编辑 - 我真的不知道什么widgetId在这里做什么，我的原代码忽略它，所以我修改了代码运行脱input:button点击，这将操纵它的兄弟姐妹。

示例HTML

<table> 
    <tr> 
     <td> 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
      <input type="button" class="check" value="Check"/> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
      <input type="button" class="check" value="Check"/> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
      <input type="button" class="check" value="Check"/> 
     </td> 
    </tr> 
</table> 

的jQuery

$('.check').click(function(){ 
    var $td = $(this).parent('td'); 

    if (!confirm('This widget will be removed, ok?')) { 
     $td.find(':checkbox').prop({disabled: true, checked: true}); 
    } else { 
     $td.find(':checkbox').prop({disabled: false, checked: false}); 
    } 
}); 

http://jsfiddle.net/SPVPx/1/

编辑2

一个不同的示例，使用input:button不在table之内。

HTML

<input type="button" class="check" value="Remove Widget 1" data-widget-id="widget1"/> 
<input type="button" class="check" value="Remove Widget 2" data-widget-id="widget2"/> 
<input type="button" class="check" value="Remove Widget 3" data-widget-id="widget3"/> 
<table> 
    <tr> 
     <td> 
      Widget 1: 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget1"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Widget 2: 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget2"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Widget 3: 
      <label>Checkbox <input type="checkbox" value="test1"/></label> 
      <input type="hidden" value="widget3"/> 
      <label>Checkbox <input type="checkbox" value="test2"/></label> 
      <label>Checkbox <input type="checkbox" value="test3"/></label> 
     </td> 
    </tr> 
</table> 

jQuery的

// For testing only. 
$(':checkbox').prop({disabled: true, checked: true}); 

$('.check').click(function(){ 
    var id = $(this).data('widget-id'), 
     $td = $('table tr td input:hidden').filter(function(){ 
      return this.value == id; 
     }).parent('td'); 

    if (confirm('This widget will be removed, ok?')) { 
     $td.find(':checkbox').prop({disabled: false, checked: false}); 
    } else { 
     $td.find(':checkbox').prop({disabled: true, checked: true}); 
    } 
}); 

http://jsfiddle.net/SPVPx/2/