如何重新加载/重绘/更新 jQuery 插件以刷新其值？

Question

我相信这很容易实现，但我不知道怎么做。是否可以在不刷新整个页面的情况下重新加载 jQuery 插件，以便刷新其值？我读过类似的问题，但它们是针对特定插件的。我想知道是否有人知道实现此目的的“通用”方法，因此它可以在许多 JQ 插件中使用。

无论如何，更具体地说，我问这个问题是为了重新加载jQuery File Tree。我有这个：

JavaScript

$(document).ready( function() {
    $('#fileTree').fileTree({
        root: '/some/path/to/somewhere/',
        script: 'js/jqueryFileTree-1.01/connectors/jqueryFileTree.php',
        folderEvent: 'click',
        expandSpeed: 1000,
        collapseSpeed: 1000,
        multiFolder: false,
        loadMessage: 'Loading...'
        }, function(file) {
            relativePath=file.replace("/some/path","");
            aFunction(relativePath, file);
        });
    });

HTML

<div id="fileTree" class="fileTree"></div>

在某个时候，我有 AJAX+PHP 代码，可以让我删除选定的文件。这很好用！但是已删除的文件仍显示在文件树中。如果我在该函数的成功事件中添加window.location.reload()，显然它会重新加载整个页面，并且我的树会按预期显示文件夹中的实际文件。

问题：有没有办法在不刷新整个页面的情况下重新加载？

请注意这个插件的作者在 Twitter 上告诉我：

@metafaniel 问题是它不再用于我们的任何项目。 这是一个需要大修的旧脚本。通过@abeautifulsite

@metafaniel 您必须自己添加。由于插件非常 旧的，它没有完整的 API。通过@abeautifulsite

我没有更多时间用另一个插件重写我的代码，我必须这样完成它。

Answer 1

好吧，如果 OP 要求使用直接插件命令来执行此操作，恐怕它可能不存在。这是我的解决方案，效果很好。您所做的是将您的空 <div id="jstree"></div> 包装在父 div 中，如下所示：

<div id="file-tree-holder">
    <div id="jstree" ></div>
</div>

然后，在您的 javascript 中，就在您实例化您的插件之前，您清除 父 div 的内容，然后在父 div 中重新编写目标 div，如下所示：

        $('#file-tree-holder').html('');
        $('#file-tree-holder').html('<div id="jstree" ></div>');
        $('#jstree').fileTree({
            script: '/ajax/file_tree2/' + path,
            multiFolder: true,
            expandSpeed: 250,
            collapseSpeed: 250,
            loadMessage: 'Loading...'
        });

...而且效果很好。