如何使用重置按钮删除选择选项标签中的背景颜色？答案

【问题标题】：How to remove the background color in select option tag with reset button?如何使用重置按钮删除选择选项标签中的背景颜色？
【发布时间】：2014-01-28 10:04:10
【问题描述】：

当我单击重置时，选择字段中的背景颜色不会变为白色。它显示最后选择的选项的颜色。请帮我解决这个问题。单击重置按钮时，我也想删除背景颜色。提前感谢您的帮助..

<body>
<form>

<input type="reset" class="resetButton" />
<select id="select" style="color: white; width:60px;"onchange="changecolor(select,value)">
<option value="white" style="background-color: white; "></option>
<option value="red" style="background-color: red; color: white;">AB</option>
<option value="blue" style="background-color: blue; color: white;">BC</option>
<option value="green" style="background-color: green; color: white;">CD</option>
<option value="orange" style="background-color: orange; color: white;">DE</option>
</select>

</form>
</body>


<script>
$(function()
{
    $('.resetButton').click(function()
    {
        $(this).closest('form').find('select').each(function()
        {
             $(this)[0].selectedIndex=0;


        });
    });
});
</script>

<script language="javascript" type="text/javascript">
function changecolor(id,color){
id.style.backgroundColor=color;
}
</script>

【问题讨论】：

标签： javascript jquery html css colors

【解决方案1】：

使用：

 $('.resetButton').click(function()
{
    $(this).closest('form').find('select').each(function()
    {
         $(this)[0].selectedIndex=0;
         changecolor($(this).attr('id'),'white');

    });
});

【讨论】：

您好 Milind，感谢您的回答。它仍然无法在我的页面上运行。请在 W3schools tryit Editor 等其他编辑器中尝试此代码，它仍然显示以前的背景颜色。
你能给我一个有选择和按钮的链接吗？
您好，只需将您和我的代码复制到 w3schools 编辑器w3schools.com/tags/tryit.asp?filename=tryhtml_select 并请检查。它没有删除背景颜色。谢谢
anton 已将上面的链接提供给 fiddle(jsfiddle.net/q8xA3/4)。只需复制代码并在 w3school 编辑器中运行即可。

【解决方案2】：

您也可以使用.css('background',color) 来执行此操作

Check demo

【讨论】：