检查是否选择框选项值包含匹配项



我需要您的帮助,

我该如何检查或不选择框选项值包含'08c''的匹配和警报(true(,如果确实如此。

将不胜感激。抱歉,由于缺乏编码技巧,因为这超出了我的思路。

使用jQuery的答案也可以接受。

<select id="fin-code-lobj">
    <optgroup label="08C - Travel for Training">
        <option value="08C1">08C1 - Travel for Technical/Operational Training – Mandatory (for/by TC employees)</option>
        <option value="08C2">08C2 - Travel for Technical/Operational Training – Non-Mandatory</option>
        <option value="08C3">08C3 - Travel for Developmental Training</option>
        <option value="08C4">08C4 - Travel for Developmental Language Training</option>
        <option value="08C5">08C5 - Travel for Statutory Language Training</option>
    </optgroup>
</select>

这应该做技巧:

$("#fin-code-lobj").on("change", function(){
  if($(this).find("option:selected").val().indexOf("08C") > -1)){
    alert(true);
  }
});

您可以通过使用$("#fin-code-lobj option")在jQuery中获取options,然后像以下

一样检查它

$("#fin-code-lobj option").each(function() {
  $(this).val().indexOf("08C") != -1 ? console.log($(this).val() + "- true"): console.log($(this).val() + "- false");
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="fin-code-lobj">
    <optgroup label="08C - Travel for Training">
        <option value="08C1">08C1 - Travel for Technical/Operational Training – Mandatory (for/by TC employees)</option>
        <option value="08C2">08C2 - Travel for Technical/Operational Training – Non-Mandatory</option>
        <option value="08C3">08C3 - Travel for Developmental Training</option>
        <option value="08C4">08C4 - Travel for Developmental Language Training</option>
        <option value="08C5">08C5 - Travel for Statutory Language Training</option>
        <option value="11">Dummy</option>
    </optgroup>
</select>

警报正确,如果:

  • 有许多精选元素...
  • 租赁中的一个有一个选项,该选项价值开头是08c(案例不敏感(

const matchOptionVal = ( options, str ) => alert (
  [...options].some(op => new RegExp("^"+str, "i").test(str) )
);
[...document.querySelectorAll("select")].forEach(sel => 
  matchOptionVal(sel.options, "08c")
);
<select id="fin-code-lobj">
    <optgroup label="08C - Travel for Training">
        <option value="08C1">08C1 - Travel for Technical/Operational Training – Mandatory (for/by TC employees)</option>
        <option value="08C2">08C2 - Travel for Technical/Operational Training – Non-Mandatory</option>
        <option value="08C3">08C3 - Travel for Developmental Training</option>
        <option value="08C4">08C4 - Travel for Developmental Language Training</option>
        <option value="08C5">08C5 - Travel for Statutory Language Training</option>
    </optgroup>
</select>

答案这是一个解决方案,它将通过每个值循环试图找到所需的字符串。用纯JS编写,因此没有库或框架依赖性。

function funStart(){
  var objDropDown = document.querySelector("#fin-code-lobj");
  if (typeof(objDropDown)=="undefined"){
    console.log("Dropdown not located");
    return;
  }
  for (a = 1; a <= objDropDown.length; a++){
    if (objDropDown[a-1].value == "08C3"){
      alert("I found 08C5");
      console.log ("Found and alerted" + a);
    }
  }
}
document.addEventListener("DOMContentLoaded", funStart, false);
<select id="fin-code-lobj">
    <optgroup label="08C - Travel for Training">
        <option value="08C1">08C1 - Travel for Technical/Operational Training – Mandatory (for/by TC employees)</option>
        <option value="08C2">08C2 - Travel for Technical/Operational Training – Non-Mandatory</option>
        <option value="08C3">08C3 - Travel for Developmental Training</option>
        <option value="08C4">08C4 - Travel for Developmental Language Training</option>
        <option value="08C5">08C5 - Travel for Statutory Language Training</option>
    </optgroup>
</select>

最新更新