弹出式菜单单击不起作用,有人可以帮助我吗?
链接在这里
enter link description here
这是图片
请单击一下以帮助我打开它,并隐藏在体内的任何位置。
这是代码
$(function () {
$('.ui-323 ul.ui-nav > li').tooltip();
});
$(document).ready(function () {
$(".ui-323 ul.ui-nav > li > a.ui-bar").click(function (e) {
/*e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}*/
});
$(".ui-323 ul.ui-nav > li > a.ui-user").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
$(".ui-323 ul.ui-nav > li > a.ui-doctor").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
$(".ui-323 ul.ui-nav > li > a.ui-patient").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
$(".ui-323 ul.ui-nav > li > a.ui-settings").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
$(".ui-323 ul.ui-nav > li > a.ui-import").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
});
最佳答案
JS中有很多不必要的代码。另外,对外部资源的引用也没有正确放置。这是更新的JS:
$(document).ready(function () {
$(".ui-323 ul.ui-nav > li > a").click(function (e) {
e.preventDefault();
if (!($(this).parents(".ui-323").hasClass("active"))) {
//$(this).parents(".ui-323").addClass("active"); //Add Class Active
}
else {
$(this).parents(".ui-323").removeClass("active"); //Remove Class Active
}
});
});
同样从您的HTML中删除类
clearfix
,如下所示:<div class="ui-323 active" style="position: fixed; width: 100%; z-index: 100;">
<!-- Your code -->
</div>
更新:
添加以下JS代码以关闭mouseleave上的菜单项:
$(".ui-323 ul.ui-nav > li > a").mouseleave(function (e) {
e.preventDefault();
$(this).parents(".ui-323").addClass("active");
});
我已经更新了JSFiddle。现在,单击即可打开菜单项,然后单击鼠标左键即可关闭。