使用javascript / jquery完全刪除具有特定類的div的所有實例？

Question

我正在使用Toddish的Popup.js。 http://docs.toddish.co.uk/popup/demos/

長話短說，對於給定的類“ .popup_back”和“ .popup_cont”，默認情況下，popup插件會創建div。 我要按下另一個按鈕，當這些類生成並添加到html之后，它們應該完全刪除帶有這些類的已添加div。 好像它們甚至不存在。 當然可以嗎？

我試過運行一個簡單運行的函數：

$(".popup_back").remove();
$(".popup_cont").remove();

如以下示例所示： http : //www.w3schools.com/jquery/tryit.asp?filename=tryjquery_dom_remove

不幸的是，盡管代碼正在運行，但實際的div從未按需刪除。

有任何想法嗎？ 我對這種事情是陌生的，已經在google上搜索了很多關於DOM等的文章，但是還沒有破解。

謝謝

編輯：回復評論：

Javascript：

function removePopups() { // This function is called to remove the popups.
   console.log("removing...");
   $(".popup_back").remove();
   $(".popup_cont").remove();
}



function func(url) { // url is the url of the image to be displayed within the popup.
   removePopups(); // As soon as the function casillas is called, removePopups is used to remove any existing instances of the divs.

   $('a.theimage').popup({ // This is where the Popup plugin is utilised.
       content : $(url),
       type : 'html'
   });
}

HTML：

<a class="theimage" onclick="func('image/image1.jpg')" href="#" >

長話短說，圖像顯示在彈出窗口中。 我認為問題在於彈出式插件由於該類而運行，但是當單擊發生時，函數func實際上從未運行。 但是，同時在控制台中仍然打印出“ removing ...”，告訴我該功能正在執行中。 問題是我希望彈出插件與javascript函數一起運行。 有解決此沖突的方法嗎？

Answer 1

您的實現實際上應該像這樣簡單：

<a class="theimage" href="#" >Open</a>

將彈出窗口創建綁定到您的彈出鏈接：

$('a.theimage').popup({
    content : 'image/image1.jpg',
    type : 'html'
});

我在這里推測，但是可能發生的情況是，您通過將popup（）調用綁定到標記中的單擊處理程序來兩次調用彈出窗口。 彈出插件已經將彈出創建綁定到click事件。

查看工作演示 。 注意3個外部資源：彈出CSS，彈出JS和jQuery JS。