通過jQuery在頁面中加載內容-Codeigniter

Question

我有兩個視圖main.php和details.php。 在main.php中 ，有很多內容，並且在每個內容下都有一個“ 查看更多 ”按鈕。 如果有人點擊查看更多 ，則ajax調用將動態地從details.php加載其余內容，這將從數據庫中獲取內容ID的數據。 這是details.php中的列表樣式視圖。 在main.php的標頭中，我的主腳本文件包含此代碼段，以從details.php獲取數據-

$('.view_more').click(function(e) {
  $.ajax({
  type: 'POST',
  url: '/path/to/my/controller/method',
  dataType: 'html',
  success: function (html) {
   $('#details_container').html(html);
  }
});
});

數據正在完美加載。 但是問題是在details.php中有一個添加內容按鈕，以及已經動態加載的每個內容都無法正常工作。 內容添加腳本位於main.php中添加的main.js中。 但是我必須添加此特定的jQuery代碼片段，以在details.php中添加內容，否則它將無法正常工作。 因此，每當單擊更多視圖時，它就會返回html數據以及用於添加內容的代碼。 這根本是不希望的。

如何解決這個問題？ 請幫忙。 提前致謝。

這是添加內容的代碼。

<script type="text/javascript">
$('.add_this').click(function(){

      var t = jQuery(this);
  var id_add = t.attr("id");
  var content_category_id = t.attr("rel");
  var add_content_id = id_add.substring(id_add.indexOf('_')+1);
  var content_creator_id = t.attr("data-clip-id");

  $.ajax({
            type: "POST",
            url: "/path/to/my/controller/method",
            data: add_content_id,
            cache: false,
            success: function(response){
                if(response)
                {
                    $("#"+id_clip).text("Clipped");
                }
            }
        });
        });
      </script>

我想再次添加，但是我能夠添加內容，但是我必須將此代碼段嵌入到我不想做的details.php中。 我需要從主腳本文件運行。

Answer 1

這應該工作：

$(document).on('click','.add_this',function(){
  var t = jQuery(this);
  var id_add = t.attr("id");
  var content_category_id = t.attr("rel");
  var add_content_id = id_add.substring(id_add.indexOf('_')+1);
  var content_creator_id = t.attr("data-clip-id");

  $.ajax({
        type: "POST",
        url: "/path/to/my/controller/method",
        data: add_content_id,
        cache: false,
        success: function(response){
            if(response)
            {
                $("#"+id_clip).text("Clipped");
            }
        }
    });
    });