用於替換div內容的jQuery html（）僅用於第一次

我正在使用AJAX請求處理我的應用程序的某些部分，該部分處理照片管理...用戶可以點擊'<'或' >'按鈕來改變照片的順序。一切運作良好，但只是第一次點擊按鈕...隨後的點擊不會觸發任何東西。用於替換div內容的jQuery html（）僅用於第一次

主要模板：

<script type="text/javascript"> 
$(function() { 
    $(".manage_photo").click(function(event) { 
     event.preventDefault(); 

     var id = $(this).attr("id"); 
     var action = $(this).attr("name"); 
     var data = { id: id, action: action }; 

     $.ajax({ 
      type: "POST", 
      url: "{% url managePhotos %}", 
      data: data, 
      success: function(results) { 
       $("#list").html(results); 
      }, 
     }); 
    }) 
}) 
</script>

....

{% if photos %} 
    <p><strong>{{ photos.count }} photo(s) added</strong></p> 
    <div class="highslide-gallery"> 
     <div id="list"> 
      {% include "ajax/photos.html" %} 
     </div> 
    </div> 
    <div class="cleaner"></div> 
{% else %} 
    <h5>Photos not yet added</h5> 
{% endif %}

代碼AJAX/photos.html：

{% for photo in photos %} 
<div class="vehicle_photo"> 
    <button class="manage_photo" name="incr" id="{{ photo.id }}" 
     {% if forloop.first %} disabled="disabled"{%endif %} style="float: left"> 
     &nbsp;<&nbsp; 
    </button> 
    <button class="manage_photo" name="decr" id="{{ photo.id }}" 
     style="float: right"> 
     &nbsp;>&nbsp; 
    </button> 
    <br /> 
    <a href="{{ photo.original_image.url }}" class="highslide" 
     onclick="return hs.expand(this)"> 
     <img class="ui-corner-all" src="{{ photo.thumbnail_image.url }}" /> 
    </a> 
    <br /> 
    {{ photo.position_number }} 
</div> 
{% endfor %}

我的看法返回photos.html的版本選擇render_to_response在更改所選照片的排序後，結果中包含該照片集中所有照片的查詢集， d狀態消息，即。成功失敗：

return render_to_response('ajax/photos.html', results)

可能是我的問題？我嘗試了以下建議：this SO question，但沒有一個適合我。自從昨天以來我一直在這裏，任何見解都將非常感激。

來源

2011-07-06 Stephen M

如果你刪除了所有的內聯代碼，最後的HTML發送到瀏覽器 –

你確定這個請求不僅會在第一次點擊之後發送嗎？請在這裏查看螢火蟲和帖子回覆。 – Andron

@Andron：是的，它只在第一次點擊後發送....我檢查了firebug，但是Rodolfo的回答已經工作 –

當你做$（function ...）中的東西被綁定時，但是當你用其他東西替換東西時，新東西沒有被綁定。您可以使用.live命令使其適用於新舊東西，或者可以再次綁定新的東西（運行$（「。manage_photo」）。在ajax之後再次單擊（...）。
BTW ，你可以用一個簡單的$（「＃list」）load（「{％url managePhotos％}」）代替ajax塊。

來源

2011-07-06 13:04:21 Rodolfo

它的功能就像一個魅力的Rodolfo ...非常感謝你的幫助，我仍然在學習這個ajax/jQuery的東西，所以學習新的東西總是很好的。爲了暗示，也是:) –

用於替換div內容的jQuery html（）僅用於第一次

回答

相關問題