關閉按鈕不起作用彈出

我做了一個彈出。它在Fiddle上正常工作，但是當我將它移植到website時，關閉按鈕不起作用。請指導我如何使它工作。謝謝。關閉按鈕不起作用彈出

HTML：

<div id="popup"> 
     <h1>JamaPunji</h1> 
     <p><a href="http://www.jamapunji.pk/" target="_blank">Click here</a> to get details.</p> 
     <a href="#" id="close_popup">Close</a> 
</div>

CSS：

#popup{ 
    position: absolute; 
    background: #004990; 
    top: 45%; 
    left: 45%; 
    width: 300px; 
    /* height: 200px;*/ 
    /* border: 1px solid #000; */ 
    border-radius: 5px; 
    padding: 5px; 
    color: #fff; 
    z-index:9999; 
} 
#close_popup { 
    color:#FFF; 
    position:absolute; 
    right:0px; 
    top:0px; 
} 
#popup h1,#popup p, #popup a{ 
    text-align:center; 
    z-index:9999; 
} 
#popup a{ 
    color:#F47B20; 
     z-index:9999; 
}

的jQuery：

<script> 
jQuery(document).ready(function() { 
    jQuery("#popup").css("display", "block"); 
    jQuery("#close_popup").click(function(){ 
     jQuery("#popup").css("display", "none"); 
    }); 
}); 
</script>

來源

2015-08-13 Fahad Uddin

您的網站有Javascript錯誤，修復後重試。 – ebilgin

可能重複的[顯示：沒有在彈出工作]（http://stackoverflow.com/questions/31959291/displaynone-not-working-in-popup） – Patrick2607

你在你的頁面有2個相同的ID #popup。這可能藏匿之前造成問題..

來源

2015-08-13 07:34:02 crackjoe

我不知不覺地通過添加SelectFeature控件到地圖。單擊彈出窗口後，查看$（「[id = pop_close]」）是否返回多個元素。我用這個來檢查關閉按鈕是否觸發： $（「＃pop_close」）。trigger（「click」）; –

在你的在jQuery文件上調用websitescript jQuery.noConflict()以使用滑塊。這意味着$不起作用，但jQuery。還要將您的ID更改爲類。你的頁面上不能有重複的ID，它會導致錯誤。您的代碼應該是這樣的：

jQuery(document).ready(function() { 
 
    jQuery(".popup").css("display", "block"); 
 
    jQuery(".close_popup").click(function(){ 
 
    jQuery(".popup").css("display", "none"); 
 
    }); 
 
});

.popup { 
 
    position: absolute; 
 
    background: #004990; 
 
    top: 45%; 
 
    left: 45%; 
 
    width: 300px; 
 
    /* height: 200px;*/ 
 
    /* border: 1px solid #000; */ 
 
    border-radius: 5px; 
 
    padding: 5px; 
 
    color: #fff; 
 
    z-index: 9999; 
 
} 
 
.close_popup { 
 
    color: #FFF; 
 
    position: absolute; 
 
    right: 0px; 
 
    top: 0px; 
 
} 
 
.popup h1, 
 
.popup p, 
 
.popup a { 
 
    text-align: center; 
 
    z-index: 9999; 
 
} 
 
.popup a { 
 
    color: #F47B20; 
 
    z-index: 9999; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="popup"> 
 
    <h1>JamaPunji</h1> 
 
    <p><a href="http://www.jamapunji.pk/" target="_blank">Click here</a> to get details.</p> 
 
    <a href="#" class="close_popup">Close</a> 
 
</div>

來源

2015-08-13 07:34:11 Patrick2607

您的網站必須具有相同ID的兩個元素。這不是一個好習慣。 ID應該在HTML頁面中是唯一的。所以你可以做的最好的事情是使用不同的ID或使用相同的類來選擇。如果不提供僅關閉父彈出窗口的條件，則使用類將導致關閉所有彈出窗口。還有另一種方式，那就是不建議。

jQuery(document).ready(function() { 
    jQuery("#popup").css("display", "block"); 
    jQuery("#close_popup").click(function(){ 
     jQuery("[id='popup']").hide(); 
    }); 
});

或使用父

jQuery("#close_popup").click(function(){ 
    jQuery(this).parents('#popup').hide(); 
});

來源

2015-08-13 07:50:07 RRK

這是你在做什麼重複id's.Id應該是唯一的每次錯誤。

來源

2015-08-13 07:56:59

關閉按鈕不起作用彈出

回答

相關問題