Question

我们如何在on()事件中使用jQuery。load方法？例如代码是：

<a href="#" id="add">Add</a>
<div id="initial">
     <input type="text" class="abc" name="in">
</div>

jQuery for it：

jQuery(document).ready(function() {
    var x=$('#initial').html();
    $('#add').click(function(){
        $('body').append(x);
    });
    $(document).on('load','.abc',function(){
        alert('started');
    });
});

Answer 1

请参阅http://api.jquery.com/on/

它说

在所有浏览器中，加载，滚动和错误事件（例如，在<img>上元素）不要泡。在Internet Explorer 8及更低版本中，粘贴和重置事件不会冒泡。不支持使用此类事件使用委托，但它们可以在事件处理程序使用时使用直接附加到生成事件的元素。

如果您想在添加新输入框时执行某些操作，则可以在添加后简单地编写代码。

$('#add').click(function(){
        $('body').append(x);
        // Your code can be here
    });

如果您希望在加载文档中的第一个输入框时执行相同的代码，那么您可以编写一个函数并在两个位置调用它，即$('#add').click和文档的就绪事件

Answer 2

我不确定你在这里要做什么 - 当jQuery(document).ready()执行时，它已经加载了，因此document的加载事件已经被调用了。此时附加load事件处理程序将不起作用，永远不会被调用。如果您在文档加载后尝试alert“已启动”，请将其放入(document).ready()调用中，如下所示：

jQuery(document).ready(function() {
    var x = $('#initial').html();
    $('#add').click(function() {
        $('body').append(x);
    });

    alert('started');

});

如果您的代码似乎暗示，您希望在加载.abc时触发警报，请将其放在单独的.load处理程序中：

jQuery(document).ready(function() {
    var x = $('#initial').html();
    $('#add').click(function() {
        $('body').append(x);
    });

    $(".abc").on("load", function() {
        alert('started');
    }
});

最后，我发现在一个地方使用jQuery而在另一个地方使用$没什么意义。保持代码一致通常更好，并且在任何地方使用jQuery或在任何地方使用$，因为这两者通常是可以互换的。

Answer 3

运行onLoad函数

jQuery(window).on("load", function(){
    ..code..
});

运行代码onDOMContentLoaded（也称为onready）

jQuery(document).ready(function(){
    ..code..
});

或onready的推荐简写

jQuery(function($){
    ..code.. ($ is the jQuery object)
});

文档加载后

onready会触发

当文档和所有相关内容（如页面上的图像已加载）时，

onload将触发。

Answer 4

正如另一个提到的那样，load事件不会冒泡。相反，您可以使用自定义事件手动触发类似负载的事件：

$('#item').on('namespace/onload', handleOnload).trigger('namespace/onload')

如果您的元素已经在监听change事件：

$('#item').on('change', handleChange).trigger('change')

我发现这很好。不过，我会坚持使用自定义事件以使其更加明确并避免产生副作用。

带有load事件的jquery .on（）方法

4 个答案: