JQuery在单击函数上添加CSS不起作用

Question

我对Windows设备(平板电脑)上的IE有异议。我有菜单和子菜单。如果菜单部分有子菜单，那么它就有类“多层次”和“内部链接”。在适当的桌面设备上，当“悬停”、“活动”、“选择”时会显示子菜单，在同一Windows设备上的其他浏览器上，这些子菜单将作为单击菜单选项来显示子菜单。然而，IE在这方面并不那么友好。

所以我做了这个解决方案，它阻止了默认的菜单选项单击(在IE中单击到子菜单选择的第一页)，然后添加onclick CSS“显示！重要”以显示子菜单，这些子菜单在带有类"list“和"lvl-2”的标签下。

但是，该解决方案部分工作，它防止默认单击IE+touch，但不添加CSS到所需的元素在同一点击。

我的代码：

$(function ieTouch() {

    var ua = window.navigator.userAgent;
    var msie = ua.indexOf("MSIE ");
    var ifTouch = ua.indexOf("Touch");

    if ((msie != 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))&& ifTouch != -1) {      // If Internet Explorer and touchscreen
        $(".multi-level .inner-link").click(function (e) {
            e.preventDefault ? e.preventDefault() : event.returnValue = false;
            $(e.currentTarget).find("ul.list.lvl-2").css("display", "block", "important");
        });
    }    
});

感谢前方的任何帮助。

Answer 1

我认为e.currentTarget.style.setProperty('display' 'block', 'important');可能是最好的解决方案。

Answer 2

jQuery不支持css中的优先级.为此，您需要使用纯javascript。

$.each($(e.currentTarget).find("ul.list.lvl-2"),function(el){
    $(el).get(0).style.setProperty('display','block', 'important');
};