-1

AJAX と PHP を使用してデータベースからデータを取得しています。データベースでは、列の 1 つに画像フォルダーのパスが含まれています。$folder という名前の PHP 変数にパスの値を保存しています。これは getuser.php コードで確認できます。
この変数を使用して画像を入力できるように、この変数を one.php で表示/使用できるようにします。どうすればこれを行うことができますか。私もphpを含めようとしましたが、役に立ちません。



getuser.php

   <?php
$q=$_GET["q"];

$con = mysql_connect('localhost', 'san', '123');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("holidayNet", $con);

$sql="SELECT * FROM image WHERE id = '".$q."'";

$result = mysql_query($sql);

echo "<table border='1'>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Picture</th>
</tr>";

while($row = mysql_fetch_array($result))
  {
    $folder = $row['FirstName'];
  echo "<tr>";
 echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "<td>" . $row['Age'] . "</td>";
  echo "<td>" . $row['Hometown'] . "</td>";


  /*echo "<td>" . $row['Job'] . "</td>";*/
  echo "</tr>";
  }
echo "</table>";

mysql_close($con);


?>



one.php

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>

<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="1">Sn Qb</option>
<option value="2">Lois Griffin</option>
<option value="3">Glenn Quagmire</option>
<option value="4">Joseph Swanson</option>
</select>
</form>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div><br />

<img src="<?php echo $folder;?>/pic1.jpg" />
<img src="<?php echo $folder;?>/pic2.jpg" />
<img src="<?php echo $folder;?>/pic3.jpg" />
<img src="<?php echo $folder;?>/pic4.jpg" />


</body>
</html>
4

3 に答える 3

2

AJAX によって呼び出される PHP ファイル (getuser.php) に変数名 $folder を作成しています。ただし、ファイル名 one.php では利用できません。

getuser.php からエコーしたものだけが JS 変数で利用可能になりますxmlhttp.responseText

したがって、getuser.php にエコーされたすべての個人情報を取得しますが、$folder 変数は取得しません。

4 つの画像を具体的にハードコーディングしたためです。選択した人物のデータベースからの他の情報とともに、getuser.php に img タグもエコーすることをお勧めします。

while($row = mysql_fetch_array($result))
{
    $folder = $row['FirstName'];
    echo "<tr>";
    echo "<td>" . $row['FirstName'] . "</td>";
    echo "<td>" . $row['LastName'] . "</td>";
    echo "<td>" . $row['Age'] . "</td>";
    echo "<td>" . $row['Hometown'] . "</td>";


    /*echo "<td>" . $row['Job'] . "</td>";*/
    echo "</tr>";
}
echo "</table>";

for($i = 0; $i < 4; $i++)
{
    echo '<img src="'.$folder.'/pic'.($i+1).'.jpg" />';
}

one.php ページからこれらのイメージ タグを削除します。

もう1つの解決策：私ができる提案は、2つのものを区別するためにセパレーターを追加することです。1 つは、印刷するテーブルと $folder 変数の値です。例：区切り記号####を検討してください

ステップ 1: これで、getuser.php のコードは次のようになります。

while($row = mysql_fetch_array($result))
{
    $folder = $row['FirstName'];
    echo "<tr>";
    echo "<td>" . $row['FirstName'] . "</td>";
    echo "<td>" . $row['LastName'] . "</td>";
    echo "<td>" . $row['Age'] . "</td>";
    echo "<td>" . $row['Hometown'] . "</td>";


    /*echo "<td>" . $row['Job'] . "</td>";*/
    echo "</tr>";
}
echo "</table>####".$folder;

ステップ 2: one.php を変更して 2 つの値を分離する

    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
// split is the function which breaks the string with the value provided and then creates an array of the parts.
        var arrResponse = (xmlhttp.responseText).split("####");
        // added || below to validate the index 1 of arrResponse. if xmlhttp.responseText does not have #### it wont break the string and hence wont have the folderName part, in such cases javascript will give undefined value, by adding || we tell if value is present take the present value otherwise take it as an empty string ''
    var folderName = arrResponse[1] || ''
        document.getElementById("txtHint").innerHTML=arrResponse[0];

        // we will fetch all the image tags from your html page
        var arrImgs = document.getElementsByTagName('img');
        var imgCount = arrImgs.length;
        for(i = 0; i < imgCount; i++)
        {
            arrImgs[i].setAttribute('src', folderName+'/pic'+(i+1)+'.jpg');
        }
    }
于 2012-05-05T20:02:28.280 に答える
0

ご要望に応じて、以前と同じ方法で可能な解決策をお知らせします

まず、両方のファイルを変更する必要があります

1 / getuser.phpに移動してすべてのエコーを削除し、代わりに文字列を変数に格納します

2 /より、ループの後に、両方の変数（$ folderとhtml文字列を含む新しい変数）を使用してインデックス付き配列を作成します

3 /その後、「json_encode」関数（PHP5以降で使用可能）を使用して、配列をjson形式でエンコードできます。

4 /まだやらなければならないことはすべて、one.phpページにあります。結果を取得するときに、「eval」関数（ネイティブJavascript関数）で取得した文字列をデコードする必要がある場合、この関数はインデックス付き配列を返します（同じインデックスで）html文字列を "txtHint" divに入れ、他の変数のコンテンツを画像タグで使用します（javascript関数を使用）

従うのに十分明確でしたか？（申し訳ありませんが、私の英語はそれほど上手ではありません:(）

于 2012-05-05T20:21:16.950 に答える
0

あなたが間違っているのは、特に PHP と HTML を混ぜ合わせているということです。ご希望であればもっと詳しく説明できますが、当面は問題の解決策を説明するだけにとどめます。あなた。

1/ one.php から $folder にアクセスできなくなります

2/ $folder から情報を取得するには、Ajax クエリ内で取得することをお勧めします。その後、Javascript 関数を使用して属性を変更できます。

3/ 別の解決策は、getuser.php でテーブルの html コードを生成しているため、画像タグが含まれている行をさらに生成することもできます。

うまく説明できましたか？そうでない場合は、もう一度試す準備ができています:)

幸運を祈ります

于 2012-05-05T19:56:44.327 に答える