Question

我的目标是每隔x秒自动刷新条目，而textarea则专注于它。当用户离开时，将删除自动刷新。

我在事件中尝试使用jquery，但它没有像我预期的那样工作。

我做错了什么？

$('#content_section').on('focus', '.reply-form textarea', function () {
        setInterval(refresh_data(this), 1000 * 1);
    });


    var refresh_data = function (element) {
        if ($(this).attr('data-parent')) {
            $.ajax({ // create an AJAX call...
                data: {}, // get the form data
                type: "POST", // GET or POST
                url: "/e/comments/" + $(this).attr('data-parent') + "/", // the file to call
                dataType: 'json',
                success: function (response) { // on success..
                    if (response.parent) {
                        $('article .comments[data-comment-list="' + response.parent + '"]').html(response.html);
                    }
                }
            });
        }
    };

Answer 1

您必须存储对间隔的引用，然后在输入失去焦点时清除它，如果要传递参数，则必须使用带有setInterval的匿名函数

$('#content_section').on({
    focus: function () {

        var self = this;

        $(this).data('timer', 
            setInterval(function() {
                 refresh_data(self);
            }, 1000)
        );
    },
    blur: function() {
        clearInterval( $(this).data('timer') );
    }
}, '.reply-form textarea');

function refresh_data(element) {

    var parent = $(element).data('parent');

    if ( parent ) {
        $.ajax({
            data: $(element).closest('form').serialize(),
            type: "POST",
            url: "/e/comments/" + parent + "/",
            dataType: 'json'
        }).done(function (response) {
            if (response.parent) {
                $('article .comments[data-comment-list="' + response.parent + '"]').html(response.html);
            }
        });
    }
};

jQuery / Javascript - 在元素聚焦时执行操作

1 个答案: