ajax負載調用後執行javascript的問題

我對Jquery沒有太多的經驗，並且在編寫正確的回調函數時遇到困難，因此在通過ajax .load（）調用加載html內容後執行單獨的javascript函數。ajax負載調用後執行javascript的問題

下面的代碼加載外部HTML內容

$('#myID').find('a').on('click', function(){ 
    e.preventDefault(); 
    var $desc = $('#insert'); 

    switch($(this).attr('href')) { 
     case 'content1.html' : 
      $desc.load('fragments/content1.html'); 
      break; 
     case 'content2.html' : 
      $desc.load('fragments/content2.html'); 
      break; 
    } 
});

下面的代碼必須

var panelWidth = 0; 
var startPanel = 1; 

window.panelWidth = $('.sp').width(); 


$('.panel_container .hiw_panel').each(function(index){ 
    $(this).css({'width':window.panelWidth+'px','left':(index*window.panelWidth)}); 
    $('.sp .panels').css('width',(index+1)*window.panelWidth+'px'); 
}); 


$('.switcher span').each(function(){ 
    $(this).on('click', function(){ 
     changePanels($(this).index()); 
    }); 
}); 


function changePanels(newIndex){ 

var newPanelPosition = (window.panelWidth * newIndex) * -1; 
$('.switcher span').removeClass('selected'); 
}

我已經刪除掉多餘的內容，使隨後由先前的功能加載的HTML執行儘可能簡潔。我只需要知道如何在第一部分之後執行第II部分。感謝您的幫助！

來源

2013-12-12 user59046

使用非匿名回調函數 –

我認爲你正在尋找：

$desc.load('fragments/content1.html', function(){ 
    //cb code here 
});

第二個參數是在請求完成時執行的回調函數。

來源

2013-12-12 03:14:21 AustinAllover

給出函數的名稱 - 例如executeAfterLoad（） - 和包括其作爲argument of .load：

case 'content1.html' : 
     $desc.load('fragments/content1.html',executeAfterLoad); 
     break; 
case 'content2.html' : 
     $desc.load('fragments/content2.html',executeAfterLoad); 
     break;

來源

2013-12-12 03:14:37 Christophe

完美...這工作（以及AustinAllover的迴應）。巨大的幫助 – user59046

嗯，是這樣的，也許：

$('#myID').on('click', 'a', function(e) { 
    e.preventDefault(); 

    $('#insert').load($(this).attr('href'), function() { 
     var panelWidth = 0; 
     var startPanel = 1; 

     window.panelWidth = $('.sp').width(); 

     $('.panel_container .hiw_panel').each(function(index) { 
      $(this).css({ 
       'width': window.panelWidth, 
       'left': (index * window.panelWidth) 
      }); 

      $('.sp .panels').css({ 
       'width': (index + 1) * window.panelWidth 
      }); 
     }); 

     $('.switcher span').each(function() { 
      $(this).bind('click', function() { 
       changePanels($(this).index()); 
      }); 
     }); 
    }); 
}); 

function changePanels(newIndex) { 
    var newPanelPosition = (window.panelWidth * newIndex) * -1; 
    $('.switcher span').removeClass('selected'); 
}

它在做什麼是結合點擊a，然後加載href屬性爲a標記的任何屬性，然後執行回調函數，這是您的第2步代碼。（您可以閱讀更多關於.load（）here）;

我認爲changePanels函數可能會丟失一些東西，因爲不使用var，但這很容易整理。

來源

2013-12-12 03:27:36 nbsp

謝謝...這似乎也是一個可行的替代解決方案。 – user59046

ajax負載調用後執行javascript的問題

回答

相關問題