Question

（JQuery新手）我有一个大约20个左右的元素列表，需要在页面加载时禁用。元素列表包含完整范围的HTML＆lt; input＆gt;元素，每个元素具有遵循一般命名约定的不同ID。

        $('#rmX\\.val').prop("disabled",true);
        $('#rmX\\.unit').prop("disabled",true);
        $('#rmX\\.ba').prop("disabled",true);
        $('#rmX\\.sms\\.opt').prop("disabled",true);
        $('#rmX\\.sms\\.val').prop("disabled",true);
        $('#rmX\\.sms\\.car').prop("disabled",true);
        $('#rmX\\.em\\.opt').prop("disabled",true);
        $('#rmX\\.em\\.val').prop("disabled",true);
        $('#rmX\\.off\\.opt1').prop("disabled",true);
        $('#rmX\\.off\\.opt2').prop("disabled",true);
        $('#rmX\\.off\\.val').prop("disabled",true);
        $('#rmZ\\.end\\.vald').prop("disabled",true);
        $('#rmZ\\.end\\.valw').prop("disabled",true);
        $('#rmZ\\.end\\.valm').prop("disabled",true);
        $('#rmZ\\.end\\.valy').prop("disabled",true);
        $('#rmZ\\.date').prop("disabled",true);
        $('#rmZ\\.time').prop("disabled",true);
        $('#rmZ\\.ap').prop("disabled",true);
        $('#evt\\.sec\\.opt2').prop("disabled",true);
        $('#evt\\.sec\\.val21').prop("disabled",true);
        $('#evt\\.sec\\.val22').prop("disabled",true);

有没有办法让这个列表更有效率，或者这就是你要做的事情。

（PS。很惊讶没有“最佳做法”标签。）

编辑：将“隐藏”从原始问题更改为“禁用”，如我的代码中所示。

Answer 1

为什么不向canBeDisabled中要禁用的所有元素添加课程#evt？

$("#evt .canBeDisabled").prop("disabled", true);

Answer 2

添加一个类，然后执行以下操作：

$('.hideClass').hide();

（OR）

$("#rmX\\.val, #rmX\\.unit, #rmX\\.ba, #rmX\\.ba").hide();

Answer 3

您可以将这些字符串存储在数组中：

var arr = [ '#rmX\\.val', '#rmX\\.unit', ... ];

然后：

$.each( arr, function ( i, val ) {
    $( val ).prop( 'disabled', true );
});

这不会提高效率，但会消除代码重复。

Answer 4

另一种方法是，如果字段组合在一起，您可以使用父对象，例如div或更好的字段集。

有关快速而肮脏的示例，请参阅this fiddle

如何使这个JQuery代码更高效

4 个答案: