[英]how to set dropdown to select after onclick event in javascript
在下拉菜单中有一个选项的情况下，我有一个下拉菜单，在按钮上有一个onclick事件，在从下拉菜单中进行选择并单击按钮后，如何将下拉菜单设置为JavaScript选择的默认菜单。
<select id="userType">
<option value="Select" disabled selected
id="myDefault">Select</option>
<option value="1">Games</option>
<option value="2">Movies</option>
</select>
<button type="button" name="button"onclick="addOption()">Send</button>
function addOption(){
if (userType.value === "Select") {
alert("Please select correct option");
}
else{
console.log(userType.options[userType.selectedIndex].value);
}
document.getElementById('userType').value = "Select";
}
非常简单。 只需通过id选择输入，并将其值设置为默认值即可。
function addOption(){ // Do stuff...and then: document.getElementById('userType').value = "Select"; }
<select id="userType"> <option value="Select" disabled selected id="myDefault">Select</option> <option value="1">Games</option> <option value="2">Movies</option> </select> <button type="button" name="button"onclick="addOption()">Send</button>
这是您的工作代码：
$("button").click(function() { $('select').prop('selectedIndex', 0); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="userType"> <option value="Select" disabled selected id="myDefault">Select</option> <option value="1">Games</option> <option value="2">Movies</option> </select> <button type="button" name="button">Send</button>
<html> <body> <form id="myForm"> <select id="a"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="opel">Opel</option> <option value="audi">Audi</option> </select> <br> <input type="button" onclick="myFunction()" value="Reset"> </form> </body> </html> <script> function myFunction() { document.getElementById('a').selectedIndex = 0; } </script>
尝试这个
您可以将change事件附加到<select>元素，声明一个变量，在事件处理程序中将变量设置为true以验证是否发生了change事件。 click <button> ，如果Boolean值为true ，请将select .selectedIndex属性设置为0 ，将Boolean设置为false 。
<script> var changed, select; function addOption() { if (changed) { select.selectedIndex = 0; changed = false; } } onload = function() { select = document.getElementById("userType"); select.onchange = function() { changed = true; } } </script> <select id="userType"> <option value="Select" disabled selected id="myDefault">Select</option> <option value="1">Games</option> <option value="2">Movies</option> </select> <button type="button" name="button" onclick="addOption()">Send</button>
如何触发HTML Select onClick事件（使用选项激活选择下拉列表）
[英]How to trigger the HTML Select onClick event (activates select dropdown with options)
如何在javascript中设置select2下拉列表的selectedindex
[英]how to set selectedindex of select2 dropdown in javascript
ReactJS - 如何在图标上的 onClick 事件后不关注 select 元素
[英]ReactJS - How to not get focus on a select element after an onClick event on an icon
如何将 JavaScript onclick 事件设置为带有 css 的类
[英]How do you set a JavaScript onclick event to a class with css
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.