使用jQuery的'click'函數加載了Ajax內容？

我有一個通過Ajax加載的包含HTML和JavaScript的php文件的內容。我有一個按鈕：使用jQuery的'click'函數加載了Ajax內容？

<button class="search_button">Search</button>

而且我有一個腳本下面將從一個jQuery功能

<script type="text/javascript"> 
    $(".search_button").click(function() { 
    var searchTerm = $('#search_box').val();   
    document.location.hash="searchTerm"; 
    return false; 
    }); 
</script>

當我單獨運行PHP文件此代碼更新的文件哈希，但加載此當來自Ajax調用的頁面，該函數不再運行。在螢火蟲腳本不存在，所以我假設我無法加載使用此方法的腳本。我也嘗試將JavaScript片段替換爲整個網站的標題，但這也失敗了。

我也在想，當有一個search_button類已經存在時，可能需要聲明該函數，但是當我之前將它們放入一個文件（通過Ajax檢索到）時無法使用它我對這個問題感到困惑。

來源

2011-01-21 Moz

您可以用現場活動在全球範圍包括它：

$(".search_button").live('click', function() { 
    var searchTerm = $('#search_box').val();   
    document.location.hash="searchTerm"; 
    return false; 
    });

jQuery將自動評估腳本塊，你看不到的功能的HTML，因爲它已經被剝離出來。但它應該已經運行。問題很可能是時機。你可以這樣做

setTimeout(function(){ 
    $(".search_button").click(function() { 
     var searchTerm = $('#search_box').val();   
     document.location.hash="searchTerm"; 
     return false; 
    }); 
}, 500);

這樣腳本加載時它等待被執行（希望讓jQuery的時間來更新與新元素的DOM）。

來源

2011-01-21 16:21:18

這是它。你需要使用.live（'click'，function（）{}）;讓事件捕捉插入到DOM中的新數據。讓大家不熟悉的頭痛。 – 2011-01-21 16:30:22

儘量只Ajax調用結束後添加腳本函數


function name(){ 
    $(".search_button").click(function() { 
    var searchTerm = $('#search_box').val();   
    document.location.hash="searchTerm"; 
    return false; 
    }); 
}

內調用這個函數。


$(document).ready(function() { 
name(); 
});

來源

2011-01-21 16:30:19 StrouMfios

從jQuery 1.7開始，不推薦使用.live()方法。使用.on()附加事件處理程序。老版本的jQuery用戶應該優先使用.delegate（）而不是.live()。

此方法提供了一種將委派的事件處理程序附加到頁面的文檔元素的方法，該方法簡化了在內容動態添加到頁面時使用事件處理程序。有關更多信息，請參閱.on()方法中關於直接與委託事件的討論。

根據其後繼者重寫.live()方法很簡單;這些都是爲所有三個事件連接方法等效調用模板：

$(selector).live(events, data, handler);    // jQuery 1.3+ 
$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+ 
$(document).on(events, selector, data, handler);  // jQuery 1.7+

的.on()用法示例結合的Click事件

$(document).on("click", "#post a", function(){ 
    alert("1"); 
})

來源

2012-12-18 07:05:10

使用jQuery的'click'函數加載了Ajax內容？

回答

相關問題