jquery - 单击时启用/禁用 div

标签 jquery click overlay

我想在点击时启用覆盖 div 并在点击时禁用它。

现在我的代码看起来像这样。也许 .on .off 使用不当?

$(function() {
    $("#sec_a_div").on("click","#wrapper_overlay");


    var docHeight = $(document).height();

    $("#wrapper_overlay")
      .height(docHeight)
      .css({
         'opacity' : 0.4,
         'position': 'absolute',
         'top': 0,
         'left': 0,
         'background-color': '#666666',
         'width': '100%',
         'z-index': 100
      })

    $.off("click","#wrapper_overlay");

});

最佳答案

我猜你想要以下内容:

$(function() {
    var docHeight = $(document).height();
    var overlay = $("#wrapper_overlay")
      .height(docHeight)
      .css({
        'opacity' : 0.4,
        'position': 'absolute',
        'top': 0,
        'left': 0,
        'background-color': '#666666',
        'width': '100%',
        'z-index': 100
      }).hide();

    overlay.on('click', function(){
        $(this).hide();
    });

    $("#sec_a_div").on('click', function(){
        overlay.show();
    });
});

理解 jQuery 的 .on.off 方法并不难:

$(elementSelector).on(eventName, eventHandler);
$(elementSelector).off(eventName, eventHandler);

地点:

  1. elementSelector 可以是任何内容,从 CSS 选择器字符串到 DOM 对象集合或之前创建的 jQuery 选择。
  2. eventName 是事件的名称,可以是默认名称之一(clickmouseoverkeydown 等)或由 $(elementSelector).trigger(eventName); 调用触发的自定义事件
  3. eventHandler 是事件发生时执行的函数,该函数的第一个参数是 jQuery 的事件对象。

还有

$(elementSelector).on('click', function(){
});

与相同

$(elementSelector).click(function(){
});

关于jquery - 单击时启用/禁用 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13020056/

相关文章:

javascript - 调查事件的 'overlay' 功能

javascript - 数据表中的类型错误

javascript - 秒倒计时的 jQuery.countdown 问题

java - HTMLUnit input.click() 未返回单击应加载的站点

css - 没有合适的解决方案来解决背景图片上的 IE 可点击性问题

css - 如何使灰色覆盖覆盖所有站点,包括帖子图像和元数据

javascript - 悬停第二个菜单后第一个下拉菜单未关闭

javascript - 滚动到下一个类元素

javascript - 为什么 javascript/jQuery 获取不到 parentNode?

python - 如何将图像蒙版叠加到原始图像上但仅显示蒙版边界框?