Question

加载特殊元素后，有什么方法可以调用函数？

类似这样的东西：

var element = $('.elements-class');
element.on('load', function() {
    // Do something
});

编辑（更好的解释）：

在DOM准备好之后，我有了元素，并且在该元素内是几个图像和一些文本。因此，我想在该块及其所有子项加载后为其设置动画。我不想等待页面的其余部分被加载。仅该特定元素，在此示例中为该元素。

Answer 1

根据您问题中的评论

我没有添加任何内容。一切都已经在.html文件中。当加载完成后，我正在尝试在特殊元素上启动动画。如果您了解我的意思，则可以在加载后将“折叠后”内容设置为动画。

您可以等待document.ready事件。 <div>或<header>元素不支持附加的load或ready事件，load事件通常针对加载远程资源（例如<img>。

这样做：

$(function () {
    //Do something
});

您确保在文档加载完成后执行回调中的代码。

继续进行编辑。您可以将<script>标签插入dom，它们将按照插入顺序执行。例如：

<div>
    <h1>Fancy title</h1>
    <script>
        /*
            here you can put code to manipulate dom elements inserted
            before this script tag.
            Trying to do $('p') here will not find the element because
            is not already in the dom.
        */
    </script>
    <p>Lorem ipsum dolor sit amet.</p>
</div>

让我知道这是否是您所需要的。

Answer 2

由于HTML中已经包含了所有内容，并且您想要执行一些操作/调用某些功能，可以使用：

$(document).ready(function () {
    //add your code here
});

请参阅JQuery文档，以更好地了解.ready函数的工作原理。

在文档“就绪”之前，无法安全地操纵页面。 jQuery为您检测到这种就绪状态。内含代码 $（document）.ready（）仅在页面Document Object运行一次模型（DOM）已准备就绪，可以执行JavaScript代码。包含代码 $（window）.on（“ load”，function（）{...}）内部将在已经准备好整个页面（图像或iframe），而不仅仅是DOM。

如果您还希望某个函数在元素更改时始终执行某些操作，则可以将.change（）附加到该元素，如下所示：

<form>
  <input class="target" type="text" value="Field 1">
  <select class="target">
    <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
  </select>
</form>
<div id="other">
  Trigger the handler
</div>

将事件绑定到具有目标类的所有元素。

$( ".target" ).change(function() {
   alert( "Handler for .change() called." );
});

每当附加元素上的DOM更改时，这将在更改功能内触发警报。

特殊元素加载后可以调用函数吗？

2 个答案: