jQuery查找所有具有相同名称的元素作为选择器开始

时间:2017-05-19 10:27:42

标签: javascript jquery

我正在构建具有SELECT和少量输入的表单。它的一部分看起来像这样(仅适用于周一的例子,将有7天......):

<div class="row">
    <div class="col-md-3">
        <div class="form-group mb-md">
            <input type="text" name="1[day]" class="form-control text-bold" value="Monday" readonly>
        </div>
    </div>
    <div class="col-md-1">
        <div class="form-group">
            <select class="form-control input-md mb-md" name="1[open]">
                <option value="1" selected>Open</option>
                <option value="0">Closed</option>
            </select>
        </div>
    </div>
    <!-- Working Hours -->
    <div class="col-md-2">
        <div class="form-group">
            <input type="text" class="form-control time" name="1[start]" value="08:00">
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group">
            <input type="text" class="form-control time" name="1[end]" value="22:00">
        </div>
    </div>

    <!-- Booking Hours -->
    <div class="col-md-2">
        <div class="form-group">
            <input type="text" class="form-control time" name="1[from]" value="08:00">
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group">
            <input type="text" class="form-control time" name="1[to]" value="22:00">
        </div>
    </div>
</div>

我想让同名开始的时间字段为SELECT字段 name start 对SELECT更改作出反应。如果value为0,则所有具有相同名称的字段将启用get属性。

到目前为止,我已经完成了这个功能,但是我不知道确定更改的字段名称是否很热,并相应地对其他字段采取措施。

$("select[name$='[open]']").change(function() {
    if ($(this).val() == 0) {
        // Should disable all input fields with same name as SELECT
    } else if ($(this).val() == 1) {
        // Should enable all input fields with same name as SELECT
    }
});

1 个答案:

答案 0 :(得分:0)

不确定这是否是您试图实现的目标。

请尝试以下代码。

$("select[name$='[open]']").change(function() {
    var num = $(this).attr("name").replace("[open]",''); 
    var elems = $( "input[name^='"+num+"']");
    if ($(this).val() == 0) {
        // Should disable all input fields with same name as SELECT
        elems.prop('disabled',true);
    } else if ($(this).val() == 1) {
        // Should enable all input fields with same name as SELECT
        elems.prop('disabled',false);
    }
});

检查工作小提琴here