通過AJAX添加圖像路徑到img標籤的src顯示圖像

下面我有一個AJAX調用，我用它來顯示模式中的用戶細節，我最近爲用戶添加了一個圖像上傳，但是現在，試圖顯示圖像。在網上查看後，我看到了非常不同的ajax調用，並且沒有適用於這種情況。簡而言之，我不知道如何將圖像添加到我在下面寫的內容中。爲了顯示圖像，我想像這樣：$（'＃user_image'）。attr（src）;但之後我有點迷路。通過AJAX添加圖像路徑到img標籤的src顯示圖像

jQuery(document).ready(function($) { 
    $('.user_details').click(function(event) { 
    var a = $(this); 

    // Get ID 
    var currentID = parseInt(a.data('id')); 

    $.ajax({ 
     type: 'post', 
     url: 'ajax_user.php', // in here you should put your query 
     dataType: 'json', 
     contentType: "application/x-www-form-urlencoded;charset=utf-8", 
     data: { 
     'user_id': currentID 
     }, // here you pass your id via ajax . 
     // in php you should use $_POST['post_id'] to get this value 
     success: function(json) { 

     // Change the ID in modal 
     var m = $('#user_details'), 
      mBody = m.find('.panel-body'); 

     // Update new content 
     $('#user_id').text(json.user_id); 
     $('#user_gender').text(json.user_gender); 
     $('#user_profession').text(json.user_profession); 
     $('#last_update').text(json.last_update); 


     m.modal('show'); 

     } 
    }); 

    event.preventDefault(); 
    }); 
});

<h2 class="pull-right label label-default display-list"> ID<span class="span-modal-text" id='user_id'></span></h2> 
<ul> 
    <li><b>Profession:</b> <span class="" id="user_profession"></span></li> 
    <li><b>Gender:</b> <span class="" id="user_gender"></span></li> 
</ul>

來源

2016-04-11 Kez

，除非它是在DATA-URI格式，你不能在JSON返回圖像。而是返回一個網址到圖像，然後您將從另一個圖像調用返回 – mplungjan

我不是想直接顯示圖像，我試圖在img標籤的src中顯示圖像路徑。 – Kez

你可以試試這個：

var imagesource = json.picture_src; 
$('#user_image').html('<img src="'+imagesource+'">');

這是假定$('#user_image')是<span>或<div>元素。

如果是<img>元素，你可以做這樣的事情：

var imagesource = json.picture_src; 
$("#user_image").attr("src",imagesource);

來源

2016-04-11 11:38:44

通過AJAX添加圖像路徑到img標籤的src顯示圖像

回答

相關問題