在元素加载时调用javascript函数

Calling a javascript function on element load

本文关键字：javascript 函数 调用 元素 加载      更新时间：2023-09-26

所以我在我的项目中使用ckEditor实现，我想为它的一个对话框提供自动完成功能。我通过在特定输入字段上调用javascript函数来实现自动完成功能。但是，我不完全确定如何获得特定的输入元素，因为它只出现在我点击ckeditor中的按钮之后，因此在文档加载时无法获得。

是否在加载特定的div/元素时触发javascript函数?我试图使用Jquery的$().load函数，但它似乎并没有开火。下面是一个简短的例子

$(".cke_reset_all cke_1 cke_editor_documentBody_dialog").on("load",function(){
console.log("Successful firing")
//some code here
});

我在控制台中没有看到任何文本，但是出现了带有类名的div。

每次包含输入的对话框加载时，将创建以下div 

<div class="cke_reset_all cke_1 cke_editor_documentBody_dialog " lang="en" aria-labelledby="cke_dialog_title_113" role="dialog" dir="ltr">

所以我试图运行我的自动完成脚本加载这个div完成后，我想要的输入字段是嵌套在它。什么好主意吗?

jQuery中的load方法是一个AJAX速记方法，所以它不是你在这里要找的。

如果你想绑定到加载事件，你需要使用on方法(或者在早期版本的jQuery中绑定)。

细节:http://api.jquery.com/on/

load事件仅适用于某些元素，如body, iframe, img, input, script。

在您的示例中，要检测页面中是否存在输入元素，您可能必须依赖于带有setTimeout或setInterval循环的轮询。在循环中，代码看起来像:

var inputs=$("div.cke_editor_documentBody_dialog input");
if (inputs.length==1) // do something

请注意，你在问题中写选择器的方式是错误的。

将On方法绑定到父div，然后查找id/class并执行您的逻辑/调用函数。

 $(function () {
    $('#parentDiv').on('click' ,'yourselectorhere',  function() {
          console.log('working');
        });
   });
相关文章：