如何使用jQuery創建一個新的div onclick

我正在處理一個任務，我需要在點擊時顯示Post Content-Img-Title而不重新加載頁面。如何使用jQuery創建一個新的div onclick

我編寫下面的代碼：

// code for ajax portfolio 
jQuery('span#ajax_post_abc a').click(function(){ 
    var portfolio_post_id= jQuery(this).attr('id'); 
    var ajaxurl = jQuery('#ajax-script-url').val(); 

    jQuery.ajax({ 
     type: 'POST', 
     url: ajaxurl,   
     data: { 
      "action": "load-filter2", 
      port_post_id: portfolio_post_id 
     }, 
     success: function(response) { 
      jQuery(".aajax-post-content").html(response); } 
     }); 
    }); 

    //New Ajax portfolio div 
    jQuery('#ajax_post_abc').click(function() { 
     jQuery(this).addClass('aajax-post-content'); 
    });

在所得響應將顯示在aajax-post-content股利。但問題是如果我有n帖子，我點擊n+1,n+2等等，它不顯示輸出。但是，如果我點擊第一個帖子n0，那麼它會顯示我需要的輸出。

來源

2013-09-16 vibz

使用的append（）而不是HTML [.append（）]（http://api.jquery.com/append/） – BuDen

您的代碼將只顯示最近發生的變化。

如果你想看到的每個改變你必須附加的變化，例如，而不是使用html的

.append：

jQuery(".aajax-post-content").append(response);

來源

2013-09-16 13:43:02 Scription

jQuery.html（）替換項目的內部HTML 。 jQuery.append（）將一個新的元素作爲一個子元素添加到指定的容器中。

聽起來像是你需要添加（）

來源

2013-09-16 13:43:37 kinghfb

content.append('<div class="item"><span>' +data + '</span></div>');

來源

2013-09-16 13:45:50 Arun

@vibz你可以reffer這篇文章 [http://stackoverflow.com/questions/16321748/jquery-add-new-div-onclick](http://stackoverflow.com/questions/16321748/jquery-add-new-div-的onclick） – Arun

試試這個

jQuery('span#ajax_post_abc a').click(function(){ 
    var portfolio_post_id= jQuery(this).attr('id'); 
    var ajaxurl = jQuery('#ajax-script-url').val(); 

    jQuery.ajax({ 
     type: 'POST', 
     url: ajaxurl,   
     data: { 
      "action": "load-filter2", 
      port_post_id: portfolio_post_id 
     }, 
     success: function(response) { 
      jQuery(".aajax-post-content").html(response); 
      jQuery(#ajax_post_abc).addClass('aajax-post-content'); 
      } 
     }); 
    });

來源

2013-09-16 13:52:57 sun

你想要的任何選擇更換#content。

$('<div>new content</div>').appendTo($('#content'));

來源

2013-09-16 14:13:47 avrahamcool

Use On method instead of Click function because when multiple clicks are to be included,it never works,So Change your code as 

$(document).on('click','#ajax_post_abc', function (e) { 
    jQuery(this).addClass('aajax-post-content'); 
});

謝謝Vibz ...

來源

2013-09-16 14:18:11 Nandakumar

如何使用jQuery創建一個新的div onclick

回答

相關問題