Question

我有一个包含多个选项的表单，这些表单会动态预先填充选项。

我想突出显示（更改背景颜色）仅适用于选择＆＃34;选择＆＃34;在选项列表中。

形式：

<form name="MyForm" method="POST" action="/myaction">
    <select>
        <option value="--">--</option>
        <option value="1">111</option>
        <option value="2" selected>222</option>
        <option value="3">333</option>
    </select>

    <select>
        <option value="--">--</option>
        <option value="1">A1</option>
        <option value="2">B2</option>
        <option value="3">C3</option>
    </select>

    <select>
        <option value="--">--</option>
        <option value="A" selected>AAA</option>
        <option value="B">BBB</option>
        <option value="C">CCC</option>
    </select>
</form>

我当前的jQuery突出显示所有选择，而不仅仅是那些选择＆＃34;选择＆＃34;在选项中。在上面的示例中，只应突出显示第一个和最后一个选择...

$('#MyForm').find('select > option:selected').parent().css('background-color', 'rgba(216,255,1,0.15)');

有关如何修复它的想法吗？

Answer 1

看起来您正在寻找属性selected：

＆＃13;

$('[name=MyForm] [selected]').parent().css('background-color', 'rgba(216,255,1,0.15)');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="MyForm" method="POST" action="/myaction">
    <select>
        <option value="--">--</option>
        <option value="1">111</option>
        <option value="2" selected>222</option>
        <option value="3">333</option>
    </select>

    <select>
        <option value="--">--</option>
        <option value="1">A1</option>
        <option value="2">B2</option>
        <option value="3">C3</option>
    </select>

    <select>
        <option value="--">--</option>
        <option value="A" selected>AAA</option>
        <option value="B">BBB</option>
        <option value="C">CCC</option>
    </select>
</form>

＆＃13;

Answer 2

你正在使用带有name="MyForm"的Form元素，但在jquery中使用'MyForm'作为id选择器$('#MyForm'). Either assign id =“MyForm”`到你的表单标签或使用下面的jquery

$('[name="MyForm"]').find('select > option:selected').parent().css('background-color', 'rgba(216,255,1,0.15)');

Answer 3

这非常简单。将option:selected替换为option[selected]，并将属性id="MyForm"添加到表单。

您可以在此fiddle中看到代码。

Answer 4

var selectedItems= $('[name="MyForm"]').find('select > option:selected');    
selectedItems.each(function(obj,ind){    
     $(obj).parent().css('background-color', 'rgba(216,255,1,0.15)');
});

jQuery选择具有＆＃34;选择＆＃34;的特定选择在选项中

4 个答案: