选择充当下拉菜单，防止使用HTML更改文本/选择

好奇，我使用HTML选择响应表中的其他选项。漂亮的HTML/CSS下拉菜单不起作用，因为它们嵌套在可滚动的响应表中，因此它们会被截断。最好的解决方案是使用HTML选择，但我不希望实际的菜单选项（例如重命名，重复，删除）更改占位符文本（例如更多），而是希望让他们执行那些操作而无需改变文字。希望这是有道理的，基本上可以像典型的CSS下拉菜单一样工作。思考？想法？选择充当下拉菜单，防止使用HTML更改文本/选择

例子： https://jsfiddle.net/gqh5at0u/

<select class="form-control"> 
    <option value="" disabled selected hidden>More</option> <!-- I want this to stay visible --> 
    <option>Rename</option> 
    <option>Duplicate</option> 
    <option disabled="disabled">----</option> 
    <option>Delete</option> 
</select>

来源

2017-09-01 Smurfman82

听起来就像一个下拉菜单？ https://www.w3schools.com/howto/howto_js_dropdown.asp –

你可以只重置价值时，你赶上事件。

$('.form-control').on('change', function(evt) { 
 
    var select = $(this); 
 
    alert(select.val()); // do stuff 
 
    
 
    select.val('none'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select class="form-control"> 
 
    <option value="none" disabled selected hidden>More</option> <!-- I want this to stay visible --> 
 
    <option>Rename</option> 
 
    <option>Open in Editor</option> 
 
    <option>Duplicate</option> 
 
    <option>Shift Due Date</option> 
 
    <option>Copy from Section</option> 
 
</select>

来源

2017-09-01 16:49:50 Armando

选择充当下拉菜单，防止使用HTML更改文本/选择

回答

相关问题