如何在Java中为onclick弹出窗口添加事件监听器？ [英] How to add event Listener for onclick PopUp In Javascript?

问题描述

请考虑使用一些超链接标记来使API调用到后端。

Consider there is some hyperlink tag that makes the API call to backend.

示例：

<a  href="/get/contact-info/" id="ember107" >Contact info </a>

后端API调用完成后，将触发/打开该页面中的弹出窗口。

After the backend API call completed it will trigger/open a popup in that page.

弹出式数据：（采样一个div数据）

<div id="ember"> <h1 id="pv-contact-info"> Contact Name</h1></div>

我的目标是从该弹出窗口中提取数据（在标记上方）。可以说来自h1标签的联系人姓名。

My objective is to extract data from this popup (above tag). Lets say Contact Name from h1 tag.

到目前为止，我尝试过的操作：

let atag = document.getElementById("ember107");
atag.addEventListener('click', () => { 
    document.getElementById("pv-contact-info").innerText; // getting from popup h1 tag
});
atag.click(); // explicit click

我遇到的问题是未捕获的TypeError：执行此语句时，无法读取null的属性单击 document.getElementById（ pv-co​​ntact-info）。innerText;

我知道问题是弹出内容没有完全加载，这就是为什么此代码 document.getElementById（ pv-co​​ntact-info） 返回null。

I know the problem is popup content was not loaded completely that's why this code document.getElementById("pv-contact-info") returning null.

我的问题是是否有任何侦听器功能来检查弹出式内容是否已加载
完全解决，否则我们可以用另一种方法做到这一点。最优选使用浏览器支持/ vanilla javascript而非库。

My Question is whether there is any listener function to check Popup content is loaded completely or we can do this in another approach. Most preferable using browser support /vanilla javascript rather than library.

推荐答案

您可以使用MutationObserver来监视对DOM的更改这页纸。 MDN 。

You can use a MutationObserver to watch for changes to the DOM on the page. MDN.

如果您需要与旧版浏览器保持兼容，请使用click事件触发您自己的手动观察器。像这样：

If you need to stay compatible with older browsers use your click event to trigger your own manual watcher. Something like:

var interval_id = false;
function lookForPopup(){
    if(interval_id){
        clearInterval(interval_id);
    }else{
        interval_id = setInterval(function(){
            var popup = document.getElementById('some-id');
            if(popup){
                // do something

                clearInterval(interval_id);
            }
        },1000);
    }
}

这篇关于如何在Java中为onclick弹出窗口添加事件监听器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！