Question

我一直在寻找一种方法来确保在内容通过jQuery加载进出页面时相应地触发所有脚本。

到目前为止，最好的方法是实时函数，但我无法在加载时触发函数，只能在加载元素的情况下运行。

EG。

$(document).ready(function(){
    $('textarea').live('keyup',function(){
        $(this).innerHeight(20 + (16 * ($(this).prop('scrollHeight') / $(this).css('line-height').replace('px', '') - 1.25)));
    });
    $('textarea').trigger('keyup');
});

这将使textarea在keyup函数上正确执行，但不会触发初始$('textarea').keyup();

我该怎么做？是否有更好的方法来实现我的目标。

我已经做到这一点，但是一旦页面加载了我的初始调用就不起作用了：

$(document).ready(function(){
    $(document).on('keyup', 'textarea',function(){
        $(this).innerHeight(20 + (16 * ($(this).prop('scrollHeight') / $(this).css('line-height').replace('px', '') - 1.25)));
    });
    $('textarea').trigger('keyup');
});

Answer 1

首先，您希望使用trigger()来触发事件。

此外，请勿使用live()，因为它已被弃用。而是使用on()。语法略有变化：

$(document).ready(function(){
    $(document).on('keyup', 'textarea', function(){
        $(this).innerHeight(20 + (16 * ($(this).prop('scrollHeight') / $(this).css('line-height').replace('px', '') - 1.25)));
    });
    $('textarea').trigger('keyup');
});

$(document).on('keyup', 'textarea', function)中的选择器的工作方式如下：

在document中查找与textarea匹配的元素（这也适用于在页面加载后添加的元素）
如果触发了keyup事件，请执行回调方法

因此，您可以编写比document更具体的内容来减少计算时间。例如：

$('#myForm').on('keyup', 'textarea', function)

Answer 2

Alp的反应完美无缺。使用trigger()时处理程序会触发，因此我不明白您的错误发生在哪里。

请确保在textarea AFTER 上触发了您已加载的任何动态内容。如果您使用jQuery的load()来引入内容，请在回调函数中触发keyup。

JS Fiddle

jQuery live（）函数用于重度ajax使用的网站

2 个答案: