使用jQuery从html复选框中删除和添加disabled属性

时间:2012-06-26 14:49:08

标签: jquery html

我正在学习jQuery,并且通过在html复选框中添加和删除disabled属性来进行一些挑剔。我想要它,以便当你选中复选框时,你不能在textarea中写一个地址,否则你必须从搜索框中选择。我已经完成了,但是复选框导致了我的麻烦。这是我的函数调用。它进入函数就好了,但是在选中时没有删除已禁用的属性,并抛出一个错误,即它无法使用addAttr方法添加禁用的。

//attach an event for clicking on the informal contact button
jQuery(document).ready(
    function () {
        jQuery('.InformalContact').live('click',
        function (event) {
            TestIfInformalContactIsChecked(event);
        });
    }
);

//check the status of the informalcontact checkbox when a user activates it
//If checked, user can input data in the contactinfo manually.
function TestIfInformalContactIsChecked(event) {
    var thisCheck = jQuery(event.target);
    if (thisCheck.is(':checked')) {
        jQuery("#ContactInfo").removeAttr('disabled');
    }
    else {
        jQuery("#ContactInfo").addAttr('disabled');     
    }
}

这是html ......

<div class="TBItemColumn1">
    Name: <input id="Name" value="" class="TBFindContact" style="width: 150px;" maxlength="50" type="text" /><br />
    <input id="InformalContact" class="InformalContact" maxlength="50" type="checkbox" ClientIDMode="Static"  />Informal Contact<br />
    <div id="TBContactSearchBox"></div>
    Notes:
    <br />
    <textarea id="Notes" style="width: 280px; height: 20px;"></textarea>
  </div>
  <div class="TBItemColumn2">
    <div class="FloatLeft">
      Contact Info:
      <br />
      <textarea id="ContactInfo" value="" style="width: 280px; height: 70px;" disabled="disabled"></textarea>
    </div>
  </div>

我在复选框上设置禁用属性的原因是什么?

1 个答案:

答案 0 :(得分:8)

启用此功能

jQuery("#ContactInfo").prop('disabled', true);

这将禁用

jQuery("#ContactInfo").prop('disabled', false);

如果您使用disabled(或removeAttr)将本机属性移除为removeProp,则无法再次添加。{p>它不应该用于更改属性值。