javascript 删除第一个选择选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26827989/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove the first select option
提问by Ivan
I'd like to remove the first option of an select tag when I click on the select tag. Is this possible?
当我点击选择标签时，我想删除选择标签的第一个选项。这可能吗？
I don't want to see the first option after that click.
我不想在点击后看到第一个选项。
Thanks for any help.
谢谢你的帮助。
回答by TheFrozenOne
You can remove the first option on click with jQuery.
您可以使用 jQuery 删除单击时的第一个选项。
$(document).on('click', 'select', function() {
$(this).find('option').get(0).remove();
});
This simply removes the first option of a select tag on click. You need to add an if statement to check if it was already removed.
这只是在点击时删除选择标签的第一个选项。您需要添加一个 if 语句来检查它是否已被删除。
回答by Kavvson
If you use bootstrap add placeholder attribute in your select.
如果您使用引导程序在您的选择中添加占位符属性。
If your not
如果你没有
<select required>
<option value="" disabled selected>Select your option</option>
<option value="1">1</option>
</select>回答by GlabbichRulz
There's also a simple no-javascript solution:
还有一个简单的无javascript解决方案：
<select>
<option style="display: none">--Choose--</option>
<option>Cheese Cake</option>
<option>Hot Pockets</option>
<option>Sausage</option>
<option>Cookies</option>
<option>Bacon</option>
</select>(Copied from the comments from @chipChocolate.py)
（复制自@chipChocolate.py 的评论）
回答by Andrew Foster
// to remove first...
document.getElementById("element_id_str").options[0].remove();
//to remove the lot...
document.getElementById("element_id_str").options.length = 0;
回答by rajvi
<select required>
<option value="" disabled selected hidden>Select your option</option>
<option value="1">1</option>
</select>
回答by Francisco Castro
Probably you just want this:
可能你只想要这个：
<select required>
<option value="" hidden>Select your option</option>
<option value="1">1</option>
</select>回答by ????
Javascript:
Javascript：
document.getElementById("SelectId")[0].remove();
Get the first option in the select and remove it.
获取选择中的第一个选项并将其删除。
回答by Paul Vergara
I had the same problem, but the solutions above just work with one form, not with many. I added some extra code in order to validate it for many in your form:
我遇到了同样的问题，但上述解决方案仅适用于一种形式，而不适用于多种形式。我添加了一些额外的代码，以便验证表单中的许多代码：
$(document).ready(function()
{
$(document).on("change","select",function()
{
var x = $(this).children().first().attr("name");
var n = x.localeCompare("todelete");
if (n == 0)
$(this).children().first().remove();
});
});
Where "todelete" is the name for all first elements [0] defined inside the
其中“todelete”是所有第一个元素 [0] 中定义的名称
Please select value //all first elem must have the same name
请选择值 //所有第一个元素必须具有相同的名称
"> //the others another name (can be the same BUT not "todelete")
"> //其他人的另一个名字（可以相同但不是“todelete”）
回答by Kroltan
A very naive way of doing this:
一种非常幼稚的方法：
$("#selector").change(function(evt) { //listen to changes of selection
var theElement = $(this);
if (!theElement.data("selected")) { //check if flag is not set
theElement.children("option")[0].remove(); //remove 1st child
theElement.data("selected", true); //set flag, so it doesn't continue removing items for every change
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="selector">
<option>--Choose--</option>
<option>Apple</option>
<option>Banana</option>
<option>Papaya</option>
</select>回答by Shaiful Islam
If you want to remove the first option use this
如果要删除第一个选项，请使用此选项
$(document).ready(function()
{
$("select").children().first().remove();
});
If you want to remove the first option after clicking on the select box use this
如果要在单击选择框后删除第一个选项，请使用此选项
$(document).ready(function()
{
var removed=false;
$(document).on("click","select",function()
{
if(!removed)
{
$(this).children().first().remove();
removed=true;
}
});
});
