2

我创建了一个简单的 jquery 弹出窗口。在我的网站中，我有几个 btns，每个链接到不同的弹出窗口。

我的问题： 有没有一种方法可以将所有按钮链接到相关的弹出窗口，而不必在下面开始按名称列出每个按钮和 div？或者是列出所有按钮和 div 的最短方法，而不必为每个按钮编写点击事件？

$(function() {
  $('.Btn1').click(function(e) {e.preventDefault();
  $('.Pop1').fadeIn();});
  $('.Btn2').click(function(e) {e.preventDefault();
  $('.Pop2').fadeIn();});
  var modalBgd = $('.PopBgd')
  $('.PopClose, .PopBgd').click(function(e) {e.preventDefault();
  modalBgd.fadeOut();});
});
4

2 回答 2

0

取决于您的链接/按钮/可点击元素的外观。我会做这样的事情：选择所有这些元素，然后将事件处理程序应用于它们，例如 

$(".popup").click(...);

您可以使用更复杂的选择器，但想法始终相同。请记住，一个元素可以有多个类。

于 2013-02-28T16:01:42.943 回答
0

您可以在链接中的数据元素中提供弹出窗口的 ID/类，如下所示：

<a href="#" data-popup=".Pop1" class="openpopup">open popup 1</a>
<a href="#" data-popup=".Pop2" class="openpopup">open popup 2</a>

这会将您的javascript减少到：

$('.openpopup').click(function(e) {
    e.preventDefault();
    $($(this).data('popup')).fadeIn();
});
于 2013-02-28T16:05:08.177 回答