代码之家 › 专栏 › 技术社区 › Hirschferkel

使用JS调用用户定义的jquery函数

jquery javascript

Hirschferkel · 技术社区 · 6 年前

我使用jquery窗口库 https://github.com/humaan/Modaal

以这种方式触发事件 $("class of element").modaal({arg1, arg2,...});

---我在这里更新了我的问题,使其更通用,并使用了iframe/html而不是外部SVG。---

为了触发一个元素,例如在加载在iframe中的外部HTML中,我对iframe应用了以下代码:

<iframe src="External.html" id="mainContent" onload="access()"></iframe>

它调用这个函数:

function access() {
var html = document.getElementById("mainContent").contentDocument.getElementById("IDofDIVelement");
html.addEventListener('click', function() {clicker();});
}
function clicker()
{
// console.log('hooray!');
$("#mainContent").contents().find("IDofDIVelement").modaal({});
//return false;
}

实际上,它只在每一秒钟点击一次。知道我没有正确考虑什么吗?

最好的

2 回复 | 直到 6 年前

Sven Liivak 6 年前

您不需要等待Windows加载,只需等待iframe:

$(function() {
    $("#mainContent").bind("load",function(){
        var myIframeElement = $(this).contents().find(".modaal");

        myIframeElement.modaal({
            content_source: '#iframe-content',
            type: 'inline',
        });
    });
});

Hirschferkel 6 年前

它不起作用的原因是iframe没有完全加载,而jquery试图附加该函数。AS $(document).ready(function(){} 不起作用,解决方法是用初始化它

$( window ).on( "load",function() {
$("#mainContent").contents().find("IDofDIVelement").modaal({});
});

这可以正确地将功能附加到iframe中的元素。

实际上,当覆盖再次打开和关闭后,modal将消失envent处理程序。所以,也许有人想为modal触发一个iframe元素,这里有一个设置可以解决这个问题。 (可通过@svenliivaks答案进行优化):

 $(window).on("load", function() {
     reload();
    });

function reload() {
    var length = $("#iframeID").contents().find("#IDofDIVelement").length;
    // The following check will return 1, as the iframe exists.
    if (length == 0) {
        setTimeout(function() { reload() }, 500);
    } else {
        $("#iframeID").contents().find("#IDofDIVelement").modaal({
            content_source: '#modalwrapper',
            overlay_close: true,
            after_close: function reattach() {
                reload();
            }
        });
    }
}

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

10 月前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

10 月前

Alex · 在轻量级中同时解构和不解构变量

11 月前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

11 月前

bairog · 从按属性筛选的对象数组字典中创建值数组

11 月前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

11 月前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

11 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

11 月前

user3472810 · Angular@Output/EventEmitter返回undefined

11 月前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

11 月前