Question

我想添加一个动态函数，如果/与任何与输入字段标签匹配的值，将自动选择下拉列表？

在下面的摘录中，应选择产品代码（因为标签为IS 产品代码）

＆＃13;

<div class="col-sm-12 col-md-4">
  <div class="form-group">
    <label for="">Product Code</label> <select id="ddlProductCode"
    class="form-control input-sm">
      <option value="0">
        --Select--
      </option>
      <option value="Product Code">
        Product Code
      </option>
      <option value="Product Name">
        Product Name
      </option>
      <option value="Product Description">
        Product Description
      </option>
      <option value="Product Category">
        Product Category
      </option>
      <option value="Product Sub Category">
        Product Sub Category
      </option>
     
    </select>
  </div>
</div>

＆＃13;

非常感谢提前！ DAV

Answer 1

如果我理解正确，这将有所帮助：

$(function() {
    var $ddlProductCode = $('#ddlProductCode');
    var labelValue = $select.prevAll("label:first").text();
    $select.val(labelValue);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-sm-12 col-md-4">
  <div class="form-group">
    <label for="">Product Code</label> <select id="ddlProductCode"
    class="form-control input-sm">
      <option value="0">
        --Select--
      </option>
      <option id="asd" value="Product Code">
        Product Code
      </option>
      <option value="Product Name">
        Product Name
      </option>
      <option value="Product Description">
        Product Description
      </option>
      <option value="Product Category">
        Product Category
      </option>
      <option value="Product Sub Category">
        Product Sub Category
      </option>
     
    </select>
  </div>
</div>

Answer 2

您可以遍历每个选项并选择与标签文本匹配的选项，如下所示：

$('option').each(function(i, option) {
    if ( option.value == $('label').text() ) {
        option.selected = "selected";
    }
});

Answer 3

检查将根据标签文本

选择值的jquery

$('#ddlProductCode option:contains(' + $('#lbl').text() +')').each(function(){
    if ($(this).val() == $('#lbl').text()) {
        $(this).attr('selected', true);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-sm-12 col-md-4">
  <div class="form-group">
    <label id="lbl" for="">Product Code</label> <select id="ddlProductCode"
    class="form-control input-sm">
      <option value="0">
        --Select--
      </option>
      <option value="Product Code">
        Product Code
      </option>
      <option value="Product Name">
        Product Name
      </option>
      <option value="Product Description">
        Product Description
      </option>
      <option value="Product Category">
        Product Category
      </option>
      <option value="Product Sub Category">
        Product Sub Category
      </option>
     
    </select>
  </div>
</div>

Answer 4

for (i = 0; i < yourselect.length; ++i) {
            if (yourselect.options[i].value == yourvalue) {
                yourselect.value = yourvalue;
            }
        }

Answer 5

不幸的是，这不是你应该使用<label>标签的方式。

HTML元素表示用户中项目的标题接口。 - Mozilla docs

所以，<label>并不意味着价值应该是什么如果您想设置默认值，只需将selected添加到<option>。

我不完全确定你为什么会这样做，所以也许我会误解，但回答你的问题，你可以根据标签名称设置<option>。

无需循环选项：

$('#ddlProductCode').val($('label').text())

如果值与组标签匹配，请选择下拉列表项？

5 个答案: