jsonを使用して画像を表示する

すべての作業をmysqlから画像を取り出す、jsファイルまで移動してうまく動作しますが、なぜ画像（ページ）セレクタが画像をページに表示しないのでしょうか。jsonを使用して画像を表示する

これは、選択したマーカーに関連するmysqlデータベースからすべての画像を取得する私のPHPファイルです。

<?php 
    $dbhost = '127.0.0.1'; 
    $dbuser = 'root'; 
    $dbpass = ''; 
    $dbname = 'maalem'; 


    $sql2 = "SELECT img FROM image WHERE L_ID=:id"; 
    try { 
     $con = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpass); 
     $con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 
     $con->query('SET NAMES utf8'); 
     $stmt = $con->prepare($sql2); 
     $stmt->bindParam("id", $_GET["L_ID"]); 
     $stmt->execute(); 
     $img = $stmt->fetchAll(PDO::FETCH_OBJ); 
     $con = null; 
     echo '{"pics":'. json_encode($img) .'}'; 
     } catch(PDOException $e) { 
     echo '{"error":{"text":'. $e->getMessage() .'}}'; 
    } 
    ?> 

//this is the javascript file 



    $('#detailsPage').live('pageshow', function (event) { 
    var id = getUrlVars()["L_ID"]; 
    $.getJSON(serviceURL + 'getmarker.php?L_ID=' + id, displayimg); 
    }); 


    function displayimg(data) { 
    var imgs = data.pics; 
    console.log(imgs); 
    $('#pic').append('<img src="' + imgs.img + '"width=160 height=160/>'); 

    $('#actionList').listview('refresh'); 

    } 


    function getUrlVars() { 
    var vars = [], 
    hash; 
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
    for (var i = 0; i < hashes.length; i++) { 
     hash = hashes[i].split('='); 
     vars.push(hash[0]); 
     vars[hash[0]] = hash[1]; 
    } 
    return vars; 
    } 

//HTML file 

    <!DOCTYPE HTML> 
    <html> 
    <head> 
    </head> 

    <body> 

     <div id="detailsPage" data-role="page" data-add-back-btn="true"> 

      <div data-role="header"> 
       <h1 id="Name"></h1> 
      </div> 

      <div data-role="content"> 


       <div id="markerDetails"> 
        <h2> الوصف </h2> 
        <p id="Dec"></p> 
        <div id="pic"></div> 
       </div> 



      </div> 

     </div> 

    </body>

出典

2017-02-12 RAB

問題は、あなたがpicによって要素を取得し、間違っているテキストを挿入しようとしている$('#pic').text('<img src="' + imgs.img + '"width=160 height=160/>');あなたはID pic とし、この行にIMGを定義している<img id="pic"/>です。

<div id="pic"></div>これは、あなたのための作業を行う、これはusinf innerHTML（ジャバスクリプト）または.html()（jQueryの）

出典

2017-02-12 18:40:20

をDIVの内側に私はそれを変更した場合でも、imgs.imgは、オブジェクト（SRC）を取らないのimgタグを挿入しますbrowser @MohdAsimSuhail – RAB

'console.log（imgs）;' 'imgs'変数は配列ですので、divに追加するには' imgs'配列を反復する必要があります。（var j = 0; j '）;} ' –

shokran、その仕事 – RAB

jsonを使用して画像を表示する

答えて

関連する問題