jQuery - 每次調用「.load」函數時都運行jQuery腳本？

我正在爲一個項目開發一個控制面板，並且與我的一些代碼有點衝突。我正在運行一些jQuery，這樣每個鏈接都會將請求頁面的內容插入到DIV中。這段代碼位於index.php頁面，所以無論如何它都會首先在頁面上運行。你從來沒有實際離開索引。jQuery - 每次調用「.load」函數時都運行jQuery腳本？

$('a').live("click",function(){ 
var external = $(this).attr('class'); 
if (external == "externalLink") { 
return true; 
} 
var page = $(this).attr('href'); 
if (!(page == "#") && (page)) { 
    $("#loading").fadeToggle("fast", "linear"); 
    $("#split-view-right #content").load(page, function(){ 
     var parentHeader = $("#split-view-right #content #parentHeader").html(); 
     $("#split-view-right #header").html(parentHeader); 
     $("#loading").fadeToggle("fast", "linear"); 
    }); 
} 
return false; 
});

在#header中，我也有一些代碼放在那裏，包括一些按鈕。其中一些我剛剛鏈接到一個頁面，這很好，但我需要運行一個腳本。當我嘗試定義腳本以在其中一個頁面上運行時，它將不會找到該按鈕，除非我使用'.live'運行它。問題在於，當我運行該活動腳本後嘗試轉到其他頁面時，它會忽略超鏈接並再次運行該代碼。下面是正在運行的代碼示例。

$(function() { 
$("#headerbutton").live('click', function() { 
    $("#loading").fadeToggle("fast", "linear"); 
    var title = $("input#title").val(); 
    var partnum = $("input#partnum").val(); 
    var descript = $("textarea#descript").val();  
    var startprice = $("input#startprice").val(); 
    var minprice = $("input#minprice").val(); 
    var domship = $("input#domship").val(); 
    var intship = $("input#intship").val(); 
    var startdate = $("input#startdate").val(); 
    var droprate = $("input#droprate").val(); 
    var dataString = 'title='+title+'&partnum='+partnum+'&descript='+descript+'&startprice='+startprice+'&minprice='+minprice+'&domship='+domship+'&intship='+intship+'&startdate='+startdate+'&droprate='+droprate;  
    $.post("savenewproduct.php", 
    { "title": title, "partnum": partnum, "descript": descript, "startprice": startprice, "minprice": minprice, "domship": domship, "intship": intship, "startdate": startdate, "droprate": droprate },  
    function(postdata){ 
     $("#split-view-right #content").load('upload_images.php?id=' + postdata.newID, function(){ 
      var parentHeader = $("#split-view-right #content #parentHeader").html(); 
      $("#split-view-right #header").html(parentHeader); 
      $("#loading").fadeToggle("fast", "linear"); 
     }); 
    }, "json"); 
    return false; 
}); 
});

我想什麼嘗試做（除非有一個更好的解決方案）是使它所以每次我運行一個「.load」的時候，我可以運行「.die」腳本來抵消該頁面上的以前的活動代碼。

任何想法？

來源

2011-09-28 Devin

我不確定我是否已經足夠了解您的詳細信息，但以下是我從中獲得的信息。

首先，它聽起來像.one()將保存在這裏，如果不是.live()要求。如果您可以設法重構您的代碼，以便您可以利用.one()，那就太好了。

除此之外，爲什麼不只是在你的函數的回調函數上附加.die()？從我所看到的，你的代碼基本上是：

$('#headerbutton').live('click', function() { 
    // some stuff 
    $.post(foo, bar, function() { 
     $("#split-view-right #content").load(herp, function() { 
      // some stuff 
      // some more stuff 
      // ... 
      // what's stopping you from doing something like this: 

      $('#headerbutton').die('click'); 
     }); 
    }); 
});

這將有效地抵消你的#headerbutton的.live()處理程序。

來源

2011-09-28 18:49:35

出於某種原因，當我這樣做時，它不起作用。我將它設置爲點擊後運行的第一件事，這對我很有用。我只需要記住每一次都要這麼做。 – Devin

如果你這樣做了，即使你的'.load（）'調用失敗，'.die（）'也會發生，所以記住這一點。：D –

沒關係。它只是一個內部用於我們構建的網站的控制面板。如果失敗，只需點擊左側的產品選項卡，即可將您帶到按鈕所需的相同位置。 – Devin

首先，下面的代碼可以簡化爲：

$('a').live("click",function(){ 
    var external = $(this).attr('class'); 
    if (external == "externalLink") { 
    return true; 
    } 
    ...

成爲

$('a:not(.external)').live("click",function(){ 
    ...

至於與腳本你的負載問題，如果要加載一個包含腳本的網頁，確保腳本總是在他們正在修改的元素之後。 $(function(){});實際上不會幫助您，因爲在加載主索引時已經觸發了DOMReady事件。

來源

2011-09-28 18:25:14

我會用bind（）的到任何用戶輸入產生的load（）

http://api.jquery.com/bind/

來源

2011-09-28 18:57:43 Juan

不知道這是否有助於或沒有，但你可以嘗試使用：

$('a:not(.external)').live("click", function(e){ 
    e.preventDefault(); 
    .... 
}

這將阻止瀏覽器默認關注該鏈接，並允許您改爲執行您的代碼。

來源

2011-09-28 19:03:59 Terry

jQuery - 每次調用「.load」函數時都運行jQuery腳本？

回答

相關問題