不想重复我自己

我有一些链接，当有人点击这些链接时，它会弹出一些信息。然后关闭它，当用户点击x.I使用jQuery的显示和隐藏来做到这一点。不同的链接有不同的信息，所以我重复自己，我想知道有什么方法可以不重复自己。 This Link将带你到我的代码是jsbin，你明白我在说什么。谢谢。不想重复我自己

来源

2013-02-27 fahad.kazi

请包括您的问题代码，不要只链接到包含它的外部页面。 – PhonicUK 2013-02-27 10:52:13

如果你给你的div你试图显示一个ID和链接你点击相同的类和div ID的href（这使得它更容易访问），你可以这样做：

http://jsfiddle.net/GE6fX/1/

HTML

<a class="show" href="#zerotwo">link1</a> 
<div id="zerotwo"> 
    <h1>Link heading <span>[close x]</span></h1> 
    <p>blah</p> 
</div> 
<a class="show" href="#zerothree">link2</a> 
<div id="zerothree"> 
    <h1>Link heading <span>[close x]</span></h1> 
    <p>blah</p> 
</div>

$('.show').click(function() { 
    var showDiv = $($(this).attr('href')); 
    showDiv.show(); 
    showDiv.find('h1 span').click(function() { 
     showDiv.hide(); 
    }); 
});

来源

2013-02-27 10:52:47 Pete

相同的类别意味着它也会打开下一个弹出框 – 2013-02-27 11:23:38

这就是id和href进来的地方 - 查看小提琴它只打开目标div – Pete 2013-02-27 11:24:49

当我点击链接1弹出窗口打开，然后当我再次单击链接2弹出窗口打开并这不应该发生。 – 2013-02-27 11:27:54

您可以通过多种方式清理此问题此处我只使用一个弹出窗格，并在每次点击时设置其内容。

http://jsbin.com/ovomaw/2/edit

，或者您可以使用某种模板库的HTML添加到文档中的每个弹出（这将让你有多个弹出窗口可见一次）。

正确的解决方案是很难确定没有更多地了解您的数据是从等

来源

2013-02-27 10:57:55

你需要通过类，你想从某种程度上链接显示的div来了，这是data-的一种方式属性。如果页面上只有一个div，它应该是一个id。

我已将您的链接更改为具有相同的类'show'（可以命名为更好），弹出按钮我给了一类closepopup，并且您的弹出窗口中有一类popup单击关闭一个会隐藏显示所有弹出窗口（这可能不是期望的行为）

的Html

<body> 
    <a class="show" data-popupid="zerotwo" href="#">link1</a> 
    <a class="show" data-popupid="zerothree" href="#">link2</a> 
    <div id="zerotwo" class="popup"> 
     <h1>Link heading <span class='closepopup'>[close x]</span></h1> 
     <p>dhakshdakdhkhdahdlldhalksh</p> 
    </div> 
    <div id="zerothree" class="popup"> 
     <h1>Project completion report submission <span class='closepopup'>[close x]</span></h1> 
     <p>dhakshdakdhkhdahdlldhalksh</p> 
    </div>      
</body>

的js

$(document).ready(function() { 
    $('.show').click(function() { 
    var popupClass = $(this).data('popupid'); 
    $('div#' + popupClass).show(); 
    }); 
    $('.closepopup').click(function() { 
    $('div.popup').hide(); 
    }); 
});

你凑ld通过在页面上有一个div来制作这个整理器，并从任何一个链接被点击的地方控制内容或弹出类型，然后在JS中动态添加弹出窗口的内容。

根据您的要求，此解决方案有很多。

来源

2013-02-27 10:59:24

我测试了你的代码，但问题是相同的类意味着它将打开下一个弹出窗口，这不应该发生。 – 2013-02-27 11:22:46

不，它只打开你想要的div，它使用id打开，关闭类。 – 2013-02-27 12:30:58

不想重复我自己

回答

相关问题