Question

我有一个函数，使用ajax的简写$.getScript()

在点击时加载相关的js函数

看起来像这样：

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

    $.getScript('/script.js');

    $.ajax({
        type: 'GET',
        url: '/file.php',
        cache: false,
        success: function(data) {
            $('#window').html(data);
        }
     });

});

这样做没问题......直到我再次点击#button并且getScript再次加载script.js意味着script.js中的任何函数都不会被触发一次，而是两次。

In another thread somebody mentioned这是一个缓存问题，因为$ .getScript（）只是$ .ajax（）和的简写，默认情况下ajax请求不会缓存脚本应该使用'cache： true '来执行长版本。

所以我试过了：

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

    $.ajax({
      url: 'script.js',
      dataType: 'script',
      cache: true,
      success: function(data) {

        $.ajax({
            type: 'GET',
            url: '/file.php',
            cache: false,
            success: function(data) {
                $('#window').html(data);
            }
         });

      }
    });
});

不幸的是，我仍然在同一条船上，每次点击#button我都会在script.js中反复添加所有功能。

该怎么办？你如何只加载一次脚本，和/或检查资源是否已经加载，如果是，不要再费心了？

Answer 1

//在doc ready范围内，loaded不是全局的：

var loaded = false;

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

    if ( !loaded ) {
        $.getScript('/script.js', function() {
             loaded = true;
        });
    }

    $.ajax({
        type: 'GET',
        url: '/file.php',
        cache: false,
        success: function(data) {
            $('#window').html(data);
        }
     });

});

Jquery加载脚本两次问题

1 个答案: