大量相同按鈕打開對話框的副本

我一直在使用JQuery第一次遇到問題。我有很多相同錨點的副本打開一個對話框，問題是當我點擊其中任何一個對話框時，對話框將以與錨點一樣多的副本打開。大量相同按鈕打開對話框的副本

的代碼看起來像這樣

腳本：

$(document).ready(function(){ 

    $('div#dialogbox').dialog({ 
     autoOpen: false 
    }); 

    $('#opener').click(function(){ 
     $('div#dialogbox').dialog('open); 
    }); 

});

對話框：

<div id="dialogbox"> 
    <p>Sample text</p> 
</div>

主持人：

<a href="#" id="opener">Click Me</a>

來源

2014-09-22 jogproof

如果我準備好你的問題，那麼你有多個'Click Me'這將是無效的HTML。 Id的應該是唯一的 – andrew 2014-09-22 13:24:32

只是一個觀察，但有沒有從.dialog（'open）;應該是.dialog（'open'）;沒有？ – fidev 2014-09-22 13:51:09

你可以嘗試

var popup; 
$(document).ready(function(){ 
popup = $('div#dialogbox').dialog({ 
autoOpen: false}); 
$('.opener').click(function(){ popup.dialog('open); }); 
});

是否能解決你的問題，那麼你將要遵循的變種，但只是一些簡單的一些最佳實踐，看看是否能解決問題

也將跟隨其他建議在其他的答案，從ID類的變化，注意確保如果這是你的問題，但你不應該有多個ID的使用相同的值

<a href="#" class="opener">Click Me</a>

也讓確保你只有一個彈出頁面上的副本

來源

2014-09-22 13:23:10 workabyte

沒有區別，仍然打開很多對話框。 – jogproof 2014-09-22 13:41:51

@jogproof只要確保頁面右側只有一個DIV對話框？每個鏈接都沒有一個？ – workabyte 2014-09-22 13:43:39

任何人在愚蠢比賽中交獎品？我有我的對話框div在「for」循環...謝謝; ） – jogproof 2014-09-22 13:53:04

嘗試的東西代替它像這樣

<a href="#" class="opener">Click Me</a>

和你的JS到

$(document).ready(function(){ 

    var popup = $('div#dialogbox').dialog({autoOpen: false}); 

    $('.opener').click(function(){ 
     popup.dialog('open); 
    }); 
});

你只是爲了有相同名稱的頁面上的1號，如果需要多，那麼你應該使用類。

來源

2014-09-22 13:23:01 Owen

我已經完成了您所建議的更改，並且其行爲依然如此。 – jogproof 2014-09-22 13:34:07

作爲一個建議，如果你想要多種不同的Modals，你總是可以像這樣格式化 - > http://jsfiddle.net/aekc4j5b/1/ – Owen 2014-09-22 13:58:14

大量相同按鈕打開對話框的副本

回答

相關問題