Javascript JQuery detect下拉列表值被选中，即使它是'；没有改变

使用JQuery或JavaScript，我想检测用户何时选择一个值，即使他们没有更改已经选择的值

如何做到这一点

我试过了-

$('#MyID').select(function(){ /*my function*/ });

及

但它们不起作用

示例-我有一个下拉列表，其中列出了年份，没有选择任何内容，用户选择“1976”，我运行一个函数。选择“1976”后，用户再次单击下拉列表并再次选择“1976”，我想再次运行该功能。

您尝试过吗

请注意，在触发该功能之前，您必须单击页面上下拉菜单之外的某个位置。我不知道这是否能通过

试试这个

要获取选定选项的值

$("body").click(function(event) {
    if(event.target.nodeName== "SELECT"){
                 selectedValue = event.target.value;
            }   
});

然后从值中获取文本

var text = $("option").filter(function() {
      return $(this).attr("value") === selectedValue;
    }).first().text();

---

你有没有试过这样的方法：

$('#MyID li').click(function(){ //my function });

---

在这里，您可以检测到下拉列表中列表元素的点击，这些元素应该是不同的选项。（如果您的HTML稍有不同，只需检查一下，看看所有选项的共同点是什么，它们是什么类型的元素？

所有系统都会运行（至少在第二次单击时…）

将开关设置为在选择时运行，并在捕获和/或打开

blur

后重置开关

var go = false;//switch off
$('#MyID').on('click',function() {//on click
    if (go) {//if go
        //do stuff here with $(this).val()
        go = false;//switch off
    } else { go = true; }//if !go, switch on
}).on('blur', function() { go = false; });//switch off on blur

拉小提琴：

编辑：对于键盘支持，类似的功能也应该可以使用

var go = false;//switch off
$('#MyID').on('focus active click',function() {//on focus/active
    doit($(this));//do it
}).on('change', function() {
    go=true;//go
    doit($(this));//and doit
}).on('blur', function() { go = false; });//switch off on blur

function doit(el) {
    if (go) {//if go
        //do stuff here with el.val()
        go = false;//switch off
    } else {go=true}//else go
}

胡闹：

试试这段代码

$("#MyID").click(function (){
    alert($("#MyID").val());
});

---

我制作了一个只在firefox上测试过的JSFIDLE。我已经通过在selectbox中添加一个虚拟选项实现了您想要的功能。此虚拟选项具有

显示：none

样式，并且在选项列表中不可见

一
二
三
四
笨蛋
$（'#myselect'）。在（'focus'，function（）{
$（this.find（“option.dummy”）.prop（“selected”，true）；
});
$（'#myselect'）。在（'change'，function（）上{
var select=$（此值）；
var text=select.find（“选项：selected”）.text（）；
$（'.dummy'）.attr（'value'，select.val（））.text（text）；
警报（select.val（））；
});

您不能，因为选择相同的值不是改变，而是相同的。也许你可以听听元素上的任何点击，在不破坏默认浏览器行为的情况下，这将是最接近的。也许可以尝试侦听一下

option

？@AndrewPeacock-option元素不会在所有浏览器中触发鼠标事件。以下是您问题的答案：为什么在值未更改的情况下再次运行该函数？可能有更好的方法，您也可以尝试

.focusin（）

和

.blur（）

，它在Chrome中对我有效（请参阅小提琴）。当我选择与已选择的值相同的值时，我不会有任何反应。现在我不确定我是否正确理解了这个问题。即使用户多次单击同一字段，也要触发该函数吗？或者你想在有人“选择”这个框并且不做任何改变就离开时触发这个函数（这就是我最初的回答的意图）？谢谢你的澄清。我想最好的解释方法是通过例子——我有一个下拉列表，其中列出了年份，没有选择任何内容，用户选择“1976”，我运行一个函数。如果用户再次单击下拉列表并再次选择“1976”，我想再次运行该功能。非常感谢，我现在就知道了。我再次更新了我的答案

.blur（）

似乎是我所知道的最接近的解决方案，但在触发函数之前仍有一些延迟。不管怎样……我刚刚意识到这个html是由于我使用的插件造成的，我尝试使用选项元素，如

$（“#MyID option”）。单击（…）

，但这不起作用，抱歉！正确，若OP指定我会做一些更像这样的事情，而这可以捕获点击事件，那个么它不会给用户选择的选项

var go = false;//switch off
$('#MyID').on('click',function() {//on click
    if (go) {//if go
        //do stuff here with $(this).val()
        go = false;//switch off
    } else { go = true; }//if !go, switch on
}).on('blur', function() { go = false; });//switch off on blur

var go = false;//switch off
$('#MyID').on('focus active click',function() {//on focus/active
    doit($(this));//do it
}).on('change', function() {
    go=true;//go
    doit($(this));//and doit
}).on('blur', function() { go = false; });//switch off on blur

function doit(el) {
    if (go) {//if go
        //do stuff here with el.val()
        go = false;//switch off
    } else {go=true}//else go
}

$("#MyID").click(function (){
    alert($("#MyID").val());
});

<select id="myselect">
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3" selected="selected">three</option>
    <option value="4">four</option>
    <option class="dummy" style="display:none">dummy</option>
</select>



$('#myselect').on('focus',function(){    
    $(this).find("option.dummy").prop("selected", true);
});

$('#myselect').on('change',function(){
    var select=$(this);
    var text=select.find("option:selected").text();

    $('.dummy').attr('value',select.val()).text(text);
    alert(select.val());


});