Question

我正在使用砌體類型代碼在我的頁面上顯示Div，並使用API​​獲取數據，因此所有內容都通過html+=加載到DOM中。

例如每個div都被加載這樣

html += '<li><div class="classname>content'; 
html += '<div id="like'+image.article_id+'">'; 
html += '<a href="#" class="like" id="'+image.article_id+'">'; 
html += '<div class="bLike" title="Like this article"></div></a></div>'; 
html += '<div id="unlike'+image.article_id+'" style="display:none;">'; 
html += '<a href="#" class="unlike" id="'+image.article_id+'">'; 
html += '<div class="bUnlike" title="Unlike this article"></div></a></div>'; 
html += '</div></li>'; 

現在，我使用所示的結果中的類似按鈕，使用AJAX來更新我的數據庫，讓用戶看到他們所希望的。簡單。

因此，要獲得Ajax代碼發揮我必須把它加載到我下面做的DOM，我上面顯示的div例子後加載此：

html += '<script type="text/javascript">'; 
    html += '$(function()'; 
    html += '{'; 
    html += '$(".like").click(function(){'; 
    html += 'var element = $(this);'; 
    html += 'var I = element.attr("id");'; 
    html += 'var info = \'wish_id=\' + I;'; 
    html += '$(\'#like\'+I).hide();'; 
    html += '$(\'#unlike\'+I).show();'; 
    html += '$.ajax({'; 
    html += 'type: "POST",'; 
    html += 'url: "/pages/includes/ajax/like.php",'; 
    html += 'data: info,'; 
    html += 'success: function(){'; 
    html += '}'; 
    html += '});'; 
    html += 'return false;'; 
    html += '});'; 
    html += '});'; 
html += '</script>'; 
html += '<script type="text/javascript" >'; 
    html += '$(function()'; 
    html += '{'; 
    html += '$(".unlike").click(function(){'; 
    html += 'var element = $(this);'; 
    html += 'var I = element.attr("id");'; 
    html += 'var info = \'wish_id=\' + I;'; 
    html += '$(\'#unlike\'+I).hide();'; 
    html += '$(\'#like\'+I).show();'; 
    html += '$.ajax({'; 
    html += 'type: "POST",'; 
    html += 'url: "/pages/includes/ajax/unlike.php",'; 
    html += 'data: info,'; 
    html += 'success: function(){'; 
    html += '}'; 
    html += '});'; 
    html += 'return false;'; 
    html += '});'; 
    html += '});'; 
html += '</script>'; 

現在，當用戶點擊像或不像，它會發射兩次，因此擊中數據庫兩次，基本上加倍了整個工作量，這從來都不是很好。

所以，我想可能上面顯示的腳本已經加載到DOM兩次。所以我去firefox的螢火蟲，看看加載到DOM的代碼。所有的div都在那裏，我使用相同的html+=加載，但不是上面的腳本。我知道它在那裏，因爲它工作正常。

那麼，爲什麼我不能看到它，爲什麼它會發射兩次呢？

有沒有更好的方式來做到這一點？

編輯：

這是加載頁面的API：

function loadData() { 
    isLoading = true; 
    $('#loaderCircle').show(); 

    $.ajax({ 
    url: apiURL, // fetches from MySQL 
    dataType: 'json', // data type 
    data: {page: page}, // page number so each request brings in next records 
    success: onLoadData // loads the data which is looped and html+= as at top of post 
    }); 
}; 

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.