JQuery.on(“mouseover”）方法不适用于IE

JQuery .on("mouseover") method not working for IE

本文关键字：方法 不适用 适用于 IE on mouseover JQuery      更新时间：2024-03-24

我正试图返回鼠标悬停时动态填充的选择选项的值。从ID可以看出，select选项是由ASP.NET列表框创建的。

$("#MainContent_LocationListBox").on("mouseover", "option", function () {
    alert($(this).val());
});

这种方法适用于Chrome，但不适用于IE 11。

我一直在尝试别人解决类似问题的方法，但没有成功。

我尝试过的：

  • JQuery的不同版本（目前为1.8.3）
  • .live方法
  • $(document).on("mouseover", "option", function ()
  • $("#MainContent_LocationListBox option").on("mouseover", null, function ()
  • 循环选择选项并将鼠标悬停在每个选项上
  • 添加<meta http-equiv="X-UA-Compatible" content="IE=edge">（我发现的几篇文章的建议）

我也试过$("#MainContent_LocationListBox option:hover").val()，它很有效，但不一致。

我已打开Internet Explorer调试，但没有返回任何错误。

您可以使用mousemove而不是mouseover。以下代码适用于Internet Explorer、Firefox和Chrome：

UPDATE：由于Windows 10上的测试失败，我添加了一个setTimeout调用，下面给出了一个建议：

$(document).ready(function () {
    var prevValue = null;
    $("#MainContent_LocationListBox").mousemove(function () {
        setTimeout(function () {
            var val = $('option:hover', $("#MainContent_LocationListBox")).val();
            if (typeof val !== 'undefined') {
                if (val !== prevValue) {
                    console.log(val); // To be replaced by actual processing
                    prevValue = val;
                }
            }
            else {
                prevValue = null;
            }
        }, 0);
    });
});

调试鼠标事件时，比起弹出alert框，我更喜欢在控制台中记录值（可以用F12显示）。

与其将事件委派添加到select选项，不如将其添加到select。

$("#MainContent_LocationListBox").on("mouseover", function () {
  alert($(this).val());
});

或者，如果您希望有活动授权

$("section").on("mouseover", "#MainContent_LocationListBox", function () {
  alert($(this).val());
});

编辑：我认为你没有正确理解如何从选择框中获得的值。使用jQuery，您可以在选择框中使用$('select').val()。

有关使用jQuery.on（）进行事件委派的详细信息http://api.jquery.com/on/

相关文章：