拒絕下拉菜單的第一個選項

Question

我該如何拒絕以下下拉菜單的第一個選項（單擊“執行”時，什么也不會發生）：

HTML：

<form name="form_name">
    <select name="ddmenu_name">
        <option>1st option (should do nothing)</option>
        <option value="link 1">link 1 name</option>
        <option value="link 2">link 2 name</option>
        <option value="link 3">link 3 name</option>
        <option value="link 4">link 4 name</option>
        <input type="button" name="Submit" value="Go" onClick="window.open(ddmenu_name.value,'newtab')">
    </select>
</form>

謝謝！

Answer 1

如果第一個選項的目的是提供標題，請使用optgroup ：

<select name="ddmenu_name"> 
    <optgroup label="1st option (should do nothing)">
        <option value="link 1">link 1 name</option> 
        <option value="link 2">link 2 name</option> 
        <option value="link 3">link 3 name</option> 
        <option value="link 4">link 4 name</option>
    </optgroup> 
</select>

適用於所有主要（新舊）瀏覽器。 不需要JavaScript。

如果這不是您的意圖，則可以執行以下操作：

var previous;
$('#ddmenu_id').on('change', function() {
    if ($(this).val() === 'noselect') {
        $(this).val(previous);
    }
    else {
        previous = $(this).val();
    }
});

使用HTML：

<select name="ddmenu_name" id="ddmenu_id"> 
<option value="noselect">1st option (should do nothing)</option> 
<option value="link 1">link 1 name</option> 
<option value="link 2">link 2 name</option> 
<option value="link 3">link 3 name</option> 
<option value="link 4">link 4 name</option> 
</select>
<input type="button" name="Submit" value="Go" onClick="window.open(ddmenu_name.value,'newtab')"> 

您可以在此處查看它的運行情況。