ShareThis-AJAX內容不起作用后加載的按鈕

Question

該網站是使用ExpressionEngine（2.8.1）構建的，但是由於要共享的內容是通過AJAX加載的，因此我決定使用ShareThis網站上“網站”的生成代碼，而不是使用過時的EE插件。

因此，ShareThis生成了以下標記，我將它們放置在通過AJAX加載的EE模板中：

<span class="st_facebook_large" displayText="Facebook"></span>
<span class="st_twitter_large" displayText="Tweet"></span>
<span class="st_pinterest_large" displayText="Pinterest"></span>
<span class="st_googleplus_large" displayText="Google +"></span>
<span class="st_email_large" displayText="Email"></span>

在標題中，我正在按提供的方式加載腳本：

<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher: "MY_PUBLISHER_ID", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>

然后在JS中，我將以下腳本綁定到加載內容的click事件：

$('#ajax-content').load('ajax/'+id, function() {
    if(window.stButtons) {
        stButtons.locateElements();
    }
}

然而，盡管按鈕是正確生成的，但它們似乎沒有綁定任何事件處理程序。 單擊它們不會執行任何操作。 我試過不檢查if(window.stButtons) ，但是沒有區別。

如果是代替stButtons.locateElements(); 我使用以下代碼，按鈕甚至不顯示：

$.getScript('http://w.sharethis.com/button/buttons.js', function(data, textStatus, jqxhr) {
    var switchTo5x = true;
    stLight.options({publisher: "MY_PUBLISHER_ID", doNotHash: false, doNotCopy: false, hashAddressBar: false});
});

有什么想法出了什么問題，我該怎么做才能使它正常工作？

Answer 1

點擊事件僅適用於DOM加載的內容。 如果在DOM加載后添加內容，則這些元素將不會具有Click事件。

為了解決這個問題，您需要使用jQuery Delegate Function 。 它也適用於“未來元素”，即以后通過使用例如Ajax加載的元素。