Javascript clearTimeout 即使使用对所有函数都可用的定时器变量也不工作

Javascript clearTimeout not working even with timer Variable Available To All Functions

我已经阅读了这里几乎所有关于清除 JS 计时器的线程,但似乎没有任何效果。这是代码

$(document).ready(function() {

  var timeout;

  $('#chat_link').click(function() {

    var id = str_replace('chat_', '', $(this).attr('alt'));

    $.ajax({
      async: false,
      type: 'POST',
      url: '/members/functions/private_message_handler.php',
      dataType: 'json',
      data: 'member=' + id + '&action=get_old_messages',
      success: function(data, textStatus) {
        $('#chat_name').html(data.name);
        $('#message_area').html(data.messages);
        $('#chat_window').show();
        $('#message_area').animate({
          scrollTop: $('#message_area').get(0).scrollHeight
        }, 100);
        $('#message_member_id').val(id);
      }

    });

    get_messages(id, timeout);

  });

  $('#close_chat').click(function() {
    $('#chat_window').hide();
    $('#chat_name').html('');
    $('#message_area').html('');
    clearTimeout(timeout);
  });


  (function($) {

    get_messages = function(member_id, timeout) {

      var time = 3000;

      timeout = setTimeout(

        function() {

          $.ajax({
            async: false,
            type: 'POST',
            url: '/members/functions/private_message_handler.php',
            dataType: 'json',
            data: 'member=' + member_id + '&action=get_old_messages',
            success: function(data, textStatus) {
              $('#message_area').html(data.messages);
              $('#message_area').animate({
                scrollTop: $('#message_area').get(0).scrollHeight
              }, 100);
              get_messages(member_id);
            }

          });

        },
        time
      );

    };

  })(jQuery);

});

如您所见,我在所有函数之外创建了超时变量,因此所有内容都可以 'see' 它,我什至尝试将它传递给 get_messages 函数。无论聊天框关闭时我做什么 ($('#close_chat').click(function()) 脚本都会保持 运行。我不确定我做错了什么但是显然有些地方不对

timeout = setTimeout(...) 在您的 get_messages 函数中更改了局部变量 timeout 的值,而不是在您的脚本最开始定义的值。 javascript 中原始类型按值传递,不能按引用传递。

您可以将您的 timeout id 存储在一个对象中并传递该对象而不是原始值。您还需要在关闭聊天时取消下一个请求。

$(document).ready(function() {

    var options = {
        timeout: null,
        isChatVisible: false
    };

    $('#chat_link').click(function() {
        options.isChatVisible = true;

        var id = str_replace('chat_', '', $(this).attr('alt'));

        $.ajax({
            async: false,
            type: 'POST',
            url: '/members/functions/private_message_handler.php',
            dataType: 'json',
            data: 'member=' + id + '&action=get_old_messages',
            success: function(data, textStatus) {
                $('#chat_name').html(data.name);
                $('#message_area').html(data.messages);
                $('#chat_window').show();
                $('#message_area').animate({
                    scrollTop: $('#message_area').get(0).scrollHeight
                }, 100);
                $('#message_member_id').val(id);
            }

        });

        get_messages(id, options);

    });

    $('#close_chat').click(function() {
        $('#chat_window').hide();
        $('#chat_name').html('');
        $('#message_area').html('');
        clearTimeout(options.timeout);
        options.isChatVisible = false;
    });


    (function($) {

        get_messages = function(member_id, options) {

            var time = 3000;

            options.timeout = setTimeout(

                function() {

                    $.ajax({
                        async: false,
                        type: 'POST',
                        url: '/members/functions/private_message_handler.php',
                        dataType: 'json',
                        data: 'member=' + member_id + '&action=get_old_messages',
                        success: function(data, textStatus) {
                            // stop polling the server if chat is closed
                            if (!options.isChatVisible) {
                                return;
                            }

                            $('#message_area').html(data.messages);
                            $('#message_area').animate({
                                scrollTop: $('#message_area').get(0).scrollHeight
                            }, 100);
                            get_messages(member_id, options);
                        }

                    });

                },
                time
            );

        };

    })(jQuery);

});