当下拉列表包含一个项时，jQuery更改不会触发。
当下拉列表中的选项被点击时，我试图触发事件。我找不到任何能解释怎么做的事。我想要的是激发事件并使用它的价值。当我使用.on而不是.change时，每次单击选择时都会触发事件，这不是我想要的，因为我只想使用所选项的值。
假设这是动态生成的：
<select id="dropdownOne">
<option value="1">NumberOne</option>
</select>假设这是动态生成的：
<select id="dropdownTwo">
<option value="1">NumberOne</option>
<option value="2">NumberTwo</option>
</select>联署材料：
$("select").change("click", function () {
//This event is not fired in dropdown one
//This event is only fired in dropdown two if I change the option
var value = $(this).val();
if(value == 1){
console.log("This logs number 1");
}else{
console.log("This logs number 2");
}
}我如何才能：
- 在仅包含一项的下拉列表中的项上触发事件。
- 在多次单击的项上触发事件。
编辑：所以，我的问题被标记为重复：
How to call onchange event when dropdown values are same
“复制”有六个答案：
Vicky :说这个问题的代码很好，而且很有效。这个答案无助于我的问题
有答案，后来被编辑了，说它不起作用。不工作
Krupesh Kotecha:在select上使用单击事件，与.on 相同的行为--这不是我想要的
Teja:解决了这个问题，但不是我的问题，当te select只有一个选项或者单击一个选项不止一次时，仍然不会触发任何事件--这不是我想要的
charu :使用.on事件with :option，不工作，因为:option是未知的，在jQuery API文档中也找不到不工作
derp:这个答案解释了如何删除重复项，然后使用更改事件，这可能适用于“重复”的问题，但我从不在选择中加载重复项，即使这样，它仍然使用更改事件，它没有按照我的问题中解释的那样做我想做的事情。这个答案不会导致问题。
因此，上述所有“重复”问题的答案都不适用于我的问题/问题。此外，这些答案中没有一个被原来的招贴画所接受。
回答 3
Stack Overflow用户
发布于 2016-06-22 06:53:28
根据定义：
当元素的值被更改时，发生onchange事件。
当只有一个选项时，例如：
<select id="dropdownOne">
<option value="1">NumberOne</option>
</select>无论您尝试更改/单击选项多少次，select的值都将保持不变，即1。而change事件永远不会执行。
根据this answer，onSelect()和onClick()事件不受<option>标记的支持。
我建议你为你的选择提供一个价值为1或0的额外选项。
<select id="dropdownOne">
<option value="-1">--- Select ---</option>
<option value="1">NumberOne</option>
</select>也可以像@Bradley Ross建议的那样创建自定义选择控件。
Stack Overflow用户
发布于 2016-06-21 18:37:26
试试下面的代码：
var value;
$('select').focus(function () {
value = this.value;
if(value == 1){
console.log("This logs number 1");
}else{
console.log("This logs number 2");
}
}).change(function() {
value = this.value;
if(value == 1){
console.log("This logs number 1");
}else{
console.log("This logs number 2");
}
});以下是jsfiddle链接：https://jsfiddle.net/cdantdor/
对于select下拉列表中的一个项，我得到了值焦点事件，在选择了item之后，通过更改事件更新了值。希望它能实现你的目标。
Stack Overflow用户
发布于 2016-06-21 18:48:32
下面的代码可能满足您的需要，尽管它并不完全是您所要求的。当您单击标记选项的按钮时，它会打开一个小菜单，当您单击“关闭”菜单时会消失。虽然它实际上不是下拉菜单，但它充当了一个下拉菜单。
问题是，您试图更改控件的内部，而不是将操作建立在控件本身的基础上。除了在接口中指定的情况外，Javascript很少控制控件的内部。
看看dropdown.asp
<!DOCTYPE html>
<html>
<head>
<script>
var button;
var textarea;
var menu;
var closer;
function starter() {
button = document.getElementById("button");
textarea = document.getElementById("textarea");
menu = document.getElementById("menu");
closer = document.getElementById("close");
textarea.value = "Display area for selections\r\n";
button.onclick = open;
closer.onclick = close;
}
function close() {
menu.style.display = "none";
menu.style.visibility = "hidden";
}
function open() {
menu.style.display = "block";
menu.style.visibility="visible";
}
function press(char) {
textarea.value = textarea.value + char + "\r\n";
}
window.onload=starter;
</script>
<style>
#menu { display:none; border: 2px solid black; }
</style>
</head>
<body>
<p>Click on button marked <i>Options</i> to open menu for selection.</p>
<form>
<div id="menu">
<p>Clicking on options will cause them to appear in the text box</p>
<ul>
<li><input type="button" value="First" onclick="press('First');" /></li>
<li><input type="button" value="Second" onclick="press('Second');" /></li>
<li><input type="button" value="Third" onclick="press('Third');"</li>
<li><input type="button" value="Close menu" id="close" /></li>
</ul>
<p>Click on <i>close menu</i> to close this section</p>
</div>
<p><input type="button" id="button" value="Options" /> </p>
<p><textarea cols="20" rows="20" id="textarea"></textarea></p>
</form>
</body>
</html>
https://stackoverflow.com/questions/37943275
复制相似问题
腾讯云开发者
