0

我想通过单击菜单外部来关闭我的 Javascript 菜单。我正在使用这个菜单。我不专业，请告诉我如何更改我的代码来做到这一点：

$("#theme_select").click( function () {
  if (theme_list_open == true) {
    $(".center ul li ul").fadeOut();
    theme_list_open = false;
  } else {
    $(".center ul li ul").show();
    theme_list_open = true;
  }
  return false;
});
$("#theme_list ul li a").click(function () {
  var theme_data = $(this).attr("rel").split(",");
  $("li.purchase a").attr("href", theme_data[1]);
  $("li.remove_frame a").attr("href", theme_data[0]);
  $("#iframe").attr("src", theme_data[0]);
  $("#theme_list a#theme_select").text($(this).text());
  $(".center ul li ul").hide();
  theme_list_open = false;
  return false;
});
4

2 回答 2

1

如果要在单击 iframe 区域时关闭该菜单，则必须在 iframe 中执行此操作。尝试将其放入 iframe 的文档就绪功能中：

$("html").click( function () {
    $(".center ul li ul", window.parent.document).fadeOut();
    window.parent.theme_list_open = false;
});
于 2012-12-05T05:09:33.913 回答
0

似乎您$("#theme_select").click( function () {用于打开和关闭菜单。并用于$("#theme_list ul li a").click(function () {处理点击菜单项，这将在之后关闭菜单。

事实上，您的问题有简单的解决方案。仅用于$("#theme_select").click打开菜单，$("#theme_list ul li a")用于处理链接，并引入$(window).click关闭菜单。

function checkAndCloseMenu(evt) {
  var dropmaker = $('#theme_select')[0];
  for (var node = evt.target; node != document.body; node = node.parentNode)
    if (node == dropmaker) return false;  // check if click in the dropmaker
  $('.center ul li ul').fadeOut();
  $(window).unbind('click', checkAndCloseMenu);
}
$("#theme_select").click(function() {
  $(".center ul li ul").show();
  $(window).click(checkAndCloseMenu);
});
$("#theme_list ul li a").click(function() {
  var theme_data = $(this).attr("rel").split(",");
  $("li.purchase a").attr("href", theme_data[1]);
  $("li.remove_frame a").attr("href", theme_data[0]);
  $("#iframe").attr("src", theme_data[0]);
  $("#theme_list a#theme_select").text($(this).text());
  return false;
});

PS：可能你应该给菜单和菜单项一些类名，你的选择器读起来很痛苦。

于 2012-12-05T04:39:03.843 回答