Javascript 用空值替换选项

假设我们在html选择中有三个选项 i、 e选择，男性，女性。 单击“我要将选择替换为”

下面的代码我试过了

<select id="ageID">
    <option value="none" >loading...</option>
    <option value="one" >one</option>
    <option value="two">two</option>
    <option value="three">three</option>
</select>  

$("#ageID").on("click",function(){

    $(this).children().first().remove();
    $(this).children().first().before(" <option value='none' > </option>");

});  

它在google chrome上运行得很好，但在mozilla或IE上却不行。 您可以尝试使用 请提供解决方案

您可以这样做：

$("#ageID").on("click focus",function(){
    this.options[0].text='';
});  

我添加了焦点事件，因为我认为您希望尽快进行更改，而不是仅单击即可进行更改。

尝试以下操作：

$("#ageID").on("click",function(){

    $(this).children().first().remove();
    $(this).children().first().before('<option value="none"> </option>');

});

---

您可以用简单的CSS模拟这一点：

小提琴：

HTML

为什么不试试这个：

$("#ageID").on("click",function(){
    $('option:first',this).text('');
}); 

---

我想你想要这样的东西

$("#ageID").on("click",function(){

    $(this).children().first().remove();
    $(this).prepend("<option value='' ></option>");

});  

---

请描述什么在FF/IE中不起作用。为什么要删除加载。。。单击而不是在加载的内容已加载完毕时？我无法在FF中选择新添加的optionempty值。在IE中，下拉列表出现了几秒钟，然后消失了。它不会立即删除第一个项目，但是在选择了一个项目后，占位符不再可用，如果我解释了问题，就会询问占位符correctly@prakash我用铬做了测试。你的问题和chrome版本是什么？抱歉，它在FF中工作。不在IE中。下拉菜单会在很短的时间内出现和消失。您真的希望它在单击时工作吗？你不能简单地将它绑定到焦点事件吗？我编辑删除了点击事件，这似乎是一个坏主意。请从您这边检查。我需要编写一个通用代码，它可以在所有三种浏览器中运行。我对jquery有点陌生

$("#ageID").on("click",function(){
    $('option:first',this).text('');
}); 

$("#ageID").on("click",function(){

    $(this).children().first().remove();
    $(this).prepend("<option value='' ></option>");

});