不想重複我自己

我有一些鏈接，當有人點擊這些鏈接時，它會彈出一些信息。然後關閉它，當用戶點擊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

不想重複我自己

回答

相關問題