JavaScript/jQuery - 通过文本从选择菜单中获取选项属性

Question

这是我的 HTML:

<select name="Pcolor" id="image" style="height:30px;">
    <option value="">Избран цвят: Blue/Lt Blue </option>
    <option value="45751303" color-number="0">Black</option>
    <option value="45751343" color-number="1">Black/Pink</option>
    <option value="45751359" color-number="2">Blue/Lt Blue</option>
    <option value="45751324" color-number="3">Dk Purple/Purpl</option>
    <option value="45751390" color-number="4">Ink/Cerise</option>
</select>

这是我的 JavaScript:

var ColorSelectt = $('#image').find('option[text="Black/Pink"]').attr("color-number");
alert(ColorSelectt);

我想做的就是从选择菜单中找到 ID 为 image 的选项有文本(无值)Black/Pink例如，然后获取 color-number="" 中包含的值.

当警报出现时，它会给我响应 undefined ，这是为什么？

我该如何修复它？

Answer 1

使用:contains content filter选择包含指定文本的所有元素。

var ColorSelectt = $('#image option:contains("Grey M/Navy")').attr("color-number");
var ColorSelectt2 = $('#image option:contains("Navy/Grey M")').attr("color-number");

alert(ColorSelectt + ':' + ColorSelectt2);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="Pcolor" id="image" style="height:30px;">
    <option value="">Избран цвят: Blue/Lt Blue </option>
    <option value="45751303" color-number="0">Black</option>
    <option value="45751343" color-number="1">Black/Pink</option>
    <option value="45751359" color-number="2">Blue/Lt Blue</option>
    <option value="45751324" color-number="3">Dk Purple/Purpl</option>
    <option value="45751390" color-number="4">Ink/Cerise</option>
    <option value="45751390" color-number="5">Grey M/Navy</option>
    <option value="45751390" color-number="6">Navy/Grey M</option>
    
</select>