Question

我正在尝试实现以下表单功能的反转。这与我希望它的运作方式相反。我希望默认情况下禁用表单元素，然后在按下“clicker”时启用。我正在尝试以下代码但没有成功。我对HTML没有任何问题，我的问题是让脚本以我想要的方式运行。

示例HTML表单元素

<input type='text'></input>
<input type='text'></input>
<input type='text'></input>
<div id='clicker' style='background-color:#FF0000; height:40px; width:100px;'></div>

这是我正在尝试的JavaScript：

$().ready(function() {

$('#clicker').click(function() {
    $('input').each(function() {
        if ($(this).attr('disabled')) {
            $(this).removeAttr('disabled');
        }
        else {
            $(this).attr({
                'disabled': 'disabled'
            });
        }
      });
   });
});

Answer 1

对prop()使用attr()而不是disabled。

您还可以使用prop(propertyName, fn)创建循环并隔离实例

$(function () {
    inputs_toggle_disable();//disable on page load, assumes none have disabled in markup
    $('button').click(inputs_toggle_disable);
});

function inputs_toggle_disable() {
    $('input').prop('disabled', function () {
        return !this.disabled
    });
}

的 DEMO

Answer 2

您似乎错过了HTML输入中的disabled属性，只需添加如下所示的属性：

<input type='text' disabled />
<input type='text' disabled />
<input type='text' disabled />

然后您的clicker按钮将删除此属性（请参阅JSFiddle）。

http://jsfiddle.net/xredrdur/

如何撤消以下表单元素禁用功能

2 个答案: