Question

我继承了这段代码，我正试图让它运转起来。它正在生成一个用于过滤产品页面的选择菜单。最初，它正在生成UL（选项是LI），但现在它被转换为选择列表。这些选项在所有浏览器中都非常出现，并且除了IE（所有版本）之外，每次浏览器中的点击效果都很好。在IE中，我可以使用下拉菜单，但是当我点击一个选项时没有任何反应。

我已经尝试更改事件以进行更改和选择，但这似乎只会打破一切。

提前感谢您的帮助！

$.each(hazardClassification, function (i) {
                cleanMenuforClass = hazardClassification[i].toLowerCase().replace(/ /g, '_').replace(/&./g, '_').replace(/\,/g, '').replace('/', '').replace('.', '');


                $("<option/>", {
                    "class": cleanMenuforClass,
                    click: function (event) {
                        $("#legend-inline-search").val("");
                            $("#pipemarker-type-selection div.product-container").css('display', '');
                        var clickedInput = $(this).attr("class");
                        var clickedCheckbox = $(this);
                        if ($(this).is(":selected")) {
                                filterItems(hazardClassification[i], clickedInput, countItems, selectedItemsContainer, clickedCheckbox);

                            } else {
                                removeFilter(hazardClassification[i], clickedInput, countItems, selectedItemsContainer);
                            }

                    }
                }).appendTo("#filter-by-classification select").append('<span>' + hazardClassification[i] + '"<span>');

        });

更新：找到一个仍然使用jQuery的解决方法，并为虚拟设计师保持简单（就是我）。 Is there a workaround to trigger an option.click event in IE?

Answer 1

我认为这是IE的问题。 IE选择（当涉及选项时）总是有非奇怪的行为。

我在新闻组中找到了这个。

我们不能使用本机事件来点击IE中的元素。 IE 总是报告选项元素的高度和宽度为0，所以有无法计算点击点的位置。

所以我认为你必须使用javascript解决方法而不是使用jquery“click”事件

Answer 2

试试这个

$.each(hazardClassification, function (i) {
                cleanMenuforClass = hazardClassification[i].toLowerCase().replace(/ /g, '_').replace(/&./g, '_').replace(/\,/g, '').replace('/', '').replace('.', '');


                $("option", {
                    "class": cleanMenuforClass,
                    click: function (event) {
                        $("#legend-inline-search").val("");
                            $("#pipemarker-type-selection div.product-container").css('display', '');
                        var clickedInput = $(this).attr("class");
                        var clickedCheckbox = $(this);
                        if ($(this).is(":selected")) {
                                filterItems(hazardClassification[i], clickedInput, countItems, selectedItemsContainer, clickedCheckbox);

                            } else {
                                removeFilter(hazardClassification[i], clickedInput, countItems, selectedItemsContainer);
                            }

                    }
                }).appendTo("#filter-by-classification select").append('<span>' + hazardClassification[i] + '"<span>');

        });

每个循环内的Jquery click事件在IE中不起作用

2 个答案: