Javascript / jQuery：从表单获取特定元素

Question

我有一个约有25个输入（文本，单选框和复选框）的扩展表单。 我希望当我单击打开jQuery对话框的按钮时，加载表单并设置除5个禁用的所有字段。 似乎很简单，但我希望将其转换为“通用”功能。 我的意思是，我有这种方法：

function disableInputs(jQueryElement, exceptions, booleanClean) {
    //Some stuff
}

我想从jQueryElement获取所有输入，但忽略具有exceptions的id的所有元素。 Exceptions是一个像这样的对象：

var exceptions = {
    0: 'clientId',
    1: 'clientName',
    2: 'clientFirstSurname',
    3: 'clientSecondSurname',
    4: 'clientAlias'
}

这是我的完整代码，也是我测试过的代码，但这是使其工作的唯一方法，如果我收到了第三个参数（ booleanClean ），它将为所有inputs设置value='' ，而不是元素没有被排除在残疾人之外。 该布尔值用于检查在调用此函数时是否要清除输入：

function disableInputs(jQueryElement, exceptions, booleanClean) {
    var inputs = jQueryElement.find('input');
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].setAttribute('disabled', true);
        for (var attr in exceptions) {
            if (inputs[i].getAttribute('id') === exceptions[attr]) {
                inputs[i].removeAttribute('disabled');
            } else {
                if (booleanClean === true) {
                    inputs[i].value = null;
                }
            }
        }
    }
}

我知道为什么不能使用干净的“选项”。 我想要的是我必须将其正确放置的位置，或者如果我可以在获取输入时设置条件以仅获取未排除的输入（优选的第二个优化选项，而不是为每个输入设置属性，并且如果已排除，则将其删除。似乎更容易工作）。

Answer 1

我建议将exceptions对象更改为常规数组：

var exceptions = ['clientId',
                  'clientName',
                  'clientFirstSurname',
                  'clientSecondSurname',
                  'clientAlias'];

...因为这样可以大大简化您的功能：

function disableInputs(jQueryElement, exceptions, booleanClean) {
    var inputs = jQueryElement.find('input');
    if (exceptions.length > 0) {
        exceptions = "#" + exceptions.join(",#");
        inputs = inputs.not(exceptions);
    }
    inputs.prop("disabled",true);
    if (booleanClean)
        inputs.val("");
}

对于您是要清除所有输入还是仅清除不在例外列表中的输入，我有些困惑。 我上面的代码只是清除那些不在列表中的代码。 要清理它们，请移动if(booleanClean) inputs.val(""); 到另一个if语句之前。

Answer 2

尝试

function disableInputs(jQueryElement, exceptions, booleanClean) {
    var not = jQuery.map(exceptions, function(item, index){
        return '#' + item;
    }).join(',')
    var inputs = jQueryElement.find(':input').not(not).prop('disabled', true);
    if(booleanClean){
        inputs.val('')
    }
}

Answer 3

您是否可以为例外项指定类名？ 那就是我会做的。

<input class="exception" />

$( "input:not(.exception)" ).prop("disabled", true);

Answer 4

试试这个：

的HTML

<form>
    <input type="text" name="input1" value="val1" />
    <input type="text" name="input2" value="val2" />
    <input type="text" name="input3" value="val3" />
</form>

JS

function disableInputs(jQueryElement, exceptions, booleanClean) {

    jQueryElement.find('input').not( exceptions.join(', ') ).each(function(){

        if( booleanClean ){
            $(this).val('');
        }

        $(this).prop('disabled', true);

    });

}


var exceptions = ['input[name=input1]', 'input[name=input3]'];

disableInputs( $('form'), exceptions, true );

这是工作示例： http : //jsfiddle.net/4Dwwk/