Jquery close div點擊

在我的代碼中，我試圖在我的DIV中使用或<script>標籤，當用戶點擊DIV時，它會自動刪除包含廣告的DIV。我的代碼100％正常工作時，我加載的圖像在DIV，但當我把或<script>標籤加載廣告內容時，它不會刪除div。我不知道爲什麼？是否有任何功能可以自動檢測點擊DIV函數並刪除它？Jquery close div點擊

這裏是現場工作示例https://jsfiddle.net/infohassan/uvzjj9h4/2/

這裏是我的HTML

$(document).ready(function() { 
 
    $('.custom_closebtn').click(function() { 
 
    $('.custom_ads_placement').remove(); 
 
    }); 
 
}); 
 
$(document).ready(function() { 
 
    $('.custom_adContent').click(function(e) { 
 
    $('.custom_ads_placement').remove(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="custom_ads_placement" style="z-index:10000;"> 
 
    <div class="custom_closebtn">Close Ad</div> 
 
    <div class="custom_adContent" style="z-index:12000;"> 
 
    <iframe src="http://exampledomain.com/ad.php" width="330" height="400" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" >Your Browser Do not Support Iframe</iframe> 
 
    </div> 
 
</div>

來源

2017-10-11 Rtra

你不想刪除它的代碼或只是隱藏它？ –

可以發佈一些html –

@MehdiBouzidi刪除或隱藏並不重要 – Rtra

我能夠正確地使代碼工作的最新情況，但是一個.remove（）在jQuery中並沒有完全支持所有瀏覽器請參閱：https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove 你可能會考慮一種不同的策略。

這裏是一個更新的答案：

$(document).ready(function() { 

    $('.custom_adContent').click(function(e) { 
    document.getElementsByClassName('custom_adContent')[0].innerHTML=""; 
    }); 

    $('.custom_closebtn').click(function() { 

    document.getElementsByClassName('custom_ads_placement')[0].innerHTML=""; 
    }); 
});

來源

2017-10-11 21:11:50 Nibb

在這種情況下，我應該使用hide（）嗎？ – Rtra

是的。這應該很好。 – Nibb

即使其隱藏時使用hide（）函數，你可以告訴我的工作示例 – Rtra

你img是覆蓋所有的DIV所以當你點擊你的DIV真的點擊不在div上的img &，你應該使用這個選擇器： .custom_ads_placement img

這是腳本，你應該實現：

$(document).ready(function(){ 
     $('.custom_closebtn').on('click',function() { 
    $('.custom_ads_placement').hide(); 

     }); 
     $('.custom_ads_placement img').on('click',function() { 
    $('.custom_ads_placement').hide(); 

     }); 
    });

，這裏是你的IMAGE JSFIDDLE/iFRAME JSFIDDLE

來源

2017-10-11 21:05:51

感謝您的答案，但作爲我的形象關閉正確的點擊，但它不會關閉，當我使用iframe或腳本標記代替 – Rtra

只需將'img'改變爲'iframe'就像這樣'$ （'.custom_ads_placement iframe'）'@R –

我做到了，但根本不起作用 – Rtra

如果我沒有記錯，你必須在它的JavaScript偵聽上的iframe點擊關閉一個iFrame。

有幾個問題是：

你不能從一個iframe修改父DOM。出於安全原因，瀏覽器不支持此操作。

要允許跨源通信您可以使用window.postMessage和發送消息到父像這樣：

top.postMessage('close_iframe', '*')

但是這需要父窗口正在監聽的消息，像這樣

window.addEventListener('message', e => { 
    if(e.data == 'close_iframe') { 
     // Delete/hide the add from here 
    } 
})

你的其他（也可能是最後一個）選項是創建一個庫並讓用戶添加它，然後這個庫創建iframe和所有相關的組件，這樣它將被嵌入到頁面中，並且所有的JavaScript都會出局iframe的ide。

來源

2017-10-11 21:17:43

時iframe不會隱藏。他正在訪問的DOM都不在iframe中。他可以隱藏包含IFRAME的東西就好了。 – Nibb

如果你想刪除的iframe，簡單地覆蓋它與容器

<div style="position:absolute;top:0;left:0;width:100%;height:100%"></div>

添加樣式父

postion:relative

然後單擊作品 JSFiddle

iframe的發生，因爲點擊是在子窗口上完成的，因此您可以像滾動一樣在iframe中執行操作。

來源

2017-10-11 21:29:28

您的代碼適用於我，但我無法點擊廣告 – Rtra

編輯：位置：相對 –

https://jsfiddle.net/uvzjj9h4/13/ –

Jquery close div點擊

回答

相關問題