JQuery在点击功能上添加CSS不起作用答案

【问题标题】：JQuery add CSS on click function not workingJQuery在点击功能上添加CSS不起作用
【发布时间】：2015-01-28 18:04:49
【问题描述】：

我在 Windows RT 设备（平板电脑）上遇到了 IE 问题。我在它下面有菜单和子菜单。如果菜单部分有子菜单，则它具有“多级”和“内部链接”类。在适当的桌面设备上，当“悬停”、“活动”、“选中”时会显示子菜单，在同一 Windows RT 设备上的其他浏览器上，这会被视为单击菜单选项来显示子菜单。但是 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");
        });
    }    
});

感谢您的帮助。

【问题讨论】：

您最初的 if 语句是否确定解析 true？
请尝试记录 msie、!!navigator.userAgent.match 和 ifTouch.. 你确定 if 是真的吗？
.css("display", "block", "important") css() 方法不接受第三个参数
您好，是的，这是真的，我已经在其中（也在点击功能中）发出了半天的警报，并在发布之前将其删除。 :)
A. Wolff - 我也尝试使用 .css("display", "block !important") 和 css("display","block")。结果相同：/

标签： javascript jquery css internet-explorer windows-rt

【解决方案1】：

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

【讨论】：

【解决方案2】：

jQuery不支持css中的优先级...你需要使用纯javascript。

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

【讨论】：