Question

我有一个select元素：

<select id="test" name="test">
<option value="blah">Test1</option>
<option value="blah">Test2</option>
.
<option value="blah">Testn</option>
</select>

我希望默认显示“选择测试”文本。我知道这样做的方法是设置一个新选项

<option selected="selected">Select a test</option>

在顶部。但我正在寻找其他方式，我不必使用标签。是否可以通过javascript（jQuery也可以）？

Answer 1

这是一个普通的js解决方案：

var selecttest = document.querySelector('#test');
selecttest.insertBefore(new Option('select a test'),selecttest.firstChild);
selecttest.selectedIndex = 0;

Answer 2

我过去用虚拟条目做过这个......

<强> HTML

<select id="test" name="test">
    <option value="0">Select an option...</option>
    <option value="blah">Test1</option>
    <option value="blah">Test2</option>
    <option value="blah">Test3</option>
    <option value="blah">Test4</option>
    <option value="blah">Test5</option>
</select>

<强>的Javascript

$("#test").on("change", function() {
    if ($(this).val() != "0") {
        $("option[value=0]", this).remove();
    }
});

这是关于jsFiddle的一个工作示例...

http://jsfiddle.net/97Bqr/

选择其他内容后，系统会立即删除“选择一个选项”选项。

选择HTML设置默认文本

2 个答案: