javascript 通过 JQuery 加载和卸载 JS 文件的最佳方式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6738380/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Best way to load and unload JS file via JQuery
提问by dedudit
I've been frustated trying to find the best way to load and unload some JS file via jQuery, this was last what I can do:
我一直在试图找到通过 jQuery 加载和卸载一些 JS 文件的最佳方法而感到沮丧，这是我能做的最后一件事：
$("#button").live("click", function(){
var pl = $(this).attr('rel');
$.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
$('#container').load(""+ siteAddress +"load/"+ pl +"/");
});
});
What I want to do is to load some page via jQuery, and at same time it will include appropriate external JS file for current page that been loaded, it work fine for the first time, but when I click the button again, the last JS still loaded, so it will trigger the function inside JS file twice time for same page.
我想要做的是通过 jQuery 加载一些页面，同时它将为当前加载的页面包含适当的外部 JS 文件，它第一次工作正常，但是当我再次单击按钮时，最后一个 JS仍然加载，因此它会在同一页面上两次触发 JS 文件中的函数。
I've been try use .append, also by change <script>attribute and create dynamicaly <script>element but still, all i got is same result.
我一直在尝试使用 .append，也通过更改<script>属性并创建动态<script>元素，但仍然得到相同的结果。
回答by Chris Pratt
You can't "unload" JavaScript. Once it's loaded, it's loaded. There's no undo.
你不能“卸载”JavaScript。一旦加载，它就加载了。没有撤消。
However, you can detach event handlers. See: http://api.jquery.com/unbind/
但是，您可以分离事件处理程序。见：http: //api.jquery.com/unbind/
live()is a special case for unbind(), though. Live event handlers are attached to documentrather than the element, so you have to remove the handler like so:
live()但是 是 的特例unbind()。实时事件处理程序附加到document而不是元素，因此您必须像这样删除处理程序：
$(document).unbind('click');
However, that would probably remove more handlers than just the one in question, so you can do one of two things: 1) name your handler function or 2) create a namespace.
但是，这可能会删除更多的处理程序，而不仅仅是有问题的处理程序，因此您可以做以下两件事之一：1) 命名您的处理程序函数或 2) 创建一个命名空间。
Naming handler function
命名处理函数
function myClickHandler(){
var pl = $(this).attr('rel');
$.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
$('#container').load(""+ siteAddress +"load/"+ pl +"/");
});
}
$("#button").live("click", myClickHandler);
// And later ...
$(document).unbind('click', myClickHandler);
Namespacing
命名空间
$("#button").live("click.myNamespace", function(){
var pl = $(this).attr('rel');
$.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
$('#container').load(""+ siteAddress +"load/"+ pl +"/");
});
});
// And later...
$(document).unbind('click.myNamespace');
UPDATE:
更新：
As @RTPMatt mentions below, die()is actually more appropriate. The method described above will work, but die()is easier to use. However, with die()you must match the selector exactly to the one used when you called live()or the results may be unpredictable:
正如@RTPMatt 在下面提到的，die()实际上更合适。上述方法将起作用，但die()更易于使用。但是，die()您必须将选择器与调用时使用的选择器完全匹配，live()否则结果可能无法预测：
$("#button").live("click", function(){
var pl = $(this).attr('rel');
$.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'', function() {
$('#container').load(""+ siteAddress +"load/"+ pl +"/");
});
});
// And later ...
$('#button').die('click');
回答by Erenor Paz
You could even have a "placeholder function" and check for its existence before loading the script again. But, first, i think it would be better to load the page and only after load the external script (and only if it's needed)
您甚至可以拥有一个“占位符函数”并在再次加载脚本之前检查它是否存在。但是，首先，我认为最好加载页面并且仅在加载外部脚本之后（并且仅在需要时）
$("#button").live("click", function()
{
var pl = $(this).attr('rel');
//now we load the page, and then the "complete" callback function runs
$('#container').load(""+ siteAddress +"load/"+ pl +"/", function()
{
we check if the function is present into memory
if (typeof window["page_" + pl + "_init"] == 'undefined')
{
//function not found, we have to load the script
$.getScript('' + siteAddress + 'min/?js=fjs'+ pl +'');
}
});
});
Into the external script you will need to have the function
进入外部脚本，您将需要具有该功能
function page_abcde_init()
{
//this is just a place holder, or could be the function used
//to initialize the loaded script (sort of a document.ready)
}
Where "abcde" of "page_abcde_init()" is the value of the clicked element var pl = $(this).attr('rel');
其中“page_abcde_init()”的“abcde”是被点击元素的值 var pl = $(this).attr('rel');
