通过jquery每个方法弹出新窗口的问题(打开多个窗口)

Problem with popping new window via jquery each method (opening more than one window)

本文关键字：窗口 问题 jquery 新窗口 通过 方法      更新时间：2023-09-26

我在http://jsfiddle.net/Vcftv/2/上创建了一个JS Fiddle来说明这个问题。

我有一些促销/模块，我通过JS变成大目标链接。基本上，整个推广/模块成为一个链接，而不仅仅是一个小的子锚/html文本链接。你可以点击promo/模块上的任何地方来跟随子href.

我需要其中的一些来打开一个新窗口中的href -我只是钩到这个目标属性。如果链接有一个target属性，那就意味着弹出一个新窗口。当我做一些测试和点击时，我遇到了多个窗口打开的问题。

在JS中，第一个模块跟随窗口中的href。第二个和第三个应该弹出新的窗口。它们不是很正常，有时一个可以正常工作，但是当你关闭新窗口并再次点击链接时，它会弹出url在2新窗口

有人有什么想法吗?

问题是，每次用户将鼠标悬停在div上时，您都会附加另一个单击事件侦听器!查看我的编辑并在控制台中注意'attach click listener'调用的频率。

Kelly的解决方案要简单得多，但是你的实现问题就像我描述的那样。这个编辑修复了这个问题。

你把事情弄得太复杂了。相反，在JS中做这样的事情:

$('.promoBigLink').click(function () {
  window.open($(this).find('a').attr('href'));
});

该代码获取所有具有promoBigLink类的元素，并打开它在其子元素中找到的第一个锚元素的href。

当然，假设每个promoBigLink中的第一个锚定元素是应该访问的元素。将CSS样式移动到<style>标记或单独的文件中。您可能必须处理某人单击锚标记本身的情况。

希望这对你有帮助!

一个可能更好的解决方案是将a向上移动，使其完全填充该区域。如果你给a一个text-decoration: none的CSS，它看起来是一样的，没有怪癖。它也更容易访问，因为你现在也可以右键单击整个区域来复制URL，等等。

你需要将div包装成一个新的a，它现在委托链接和目标。

http://jsfiddle.net/pimvdb/Vcftv/6/

(function($) {
    $.fn.promoBigLink = function() {
        return this.wrap(function() {
            var href   = $(this).find("a").attr('href'),   // save href + target
                target = $(this).find("a").attr('target');
            // wrap div into new a with href + target, with added class
            return $("<a>", {href: href,
                             target: target}).addClass("biglink");
        });
    };
})(jQuery);
$(function() {
    $('div.promoBigLink').promoBigLink();
});

问题是每次你把鼠标悬停在链接上，它都会读取点击事件。

你可以在hover的out listener中使用jquery unbind来解除click事件的绑定。

$(this).unbind('click');

但是，最好使用其他一些建议来重构您的代码。

相关文章：