1

画像へのファイルパスを含む配列をプルするSQLクエリがあります。

これは変数に格納されており$rows、インデックスを作成することで個々のパスにアクセスできます...

IE。

$rows[0]...$rows[n]

これをステップスルーするためにJavaスクリプトをどのように利用できますか。

最終的な目標は、画像の下に「次へ」「前へ」ボタンが表示されるようにすることです。次に押すと、次の画像が表示されます（更新なし）

echo $rows[0];

印刷します

images/a.png
4

3 に答える 3

1

たぶん、PHPのjson関数を使用して、PHP配列をjs配列に変換できます...次に、javascript関数を使用して、表示する画像を制御します

<script type="text/javascript">
    var images = <?php echo json_encode($rows) ?>, counter = 0;

    function prevImage() {
        counter = (counter<=0)?images.length-1:counter-1;
        var i = document.getElementById('myImage');
        i.src = images[counter];
    }
    function nextImage() {
        counter = (counter==images.length-1)?0:counter+1;
        var i = document.getElementById('myImage');
        i.src = images[counter];
    }
</script>

と

<img src="img/0.jpg" id="myImage" />
<a href="#" onClick="prevImage(); return false;">Previous</a> - <a href="#" onClick="nextImage(); return false;">Next</a>​
于 2012-12-19T19:04:07.837 に答える
0

php配列をjavascript配列に移動する簡単な例を次に示します。

<?php
    $row = array("image/image1","image/image2","image/image3");
?>
<html>
    <head>
    <title>Sample Array</title>
    <script>
    var jsArray = new Array();
    <?php 
    for ($i=0; $i<3; $i++)
    {
         echo "jsArray[$i] = '$row[$i]';";  
    }
    ?>
    for(i = 0; i < jsArray.length;i++)
    {
        alert(jsArray[i]);
    }
    </script>
    </head>
    <body>
        <span>Sample Array</span>
    </body>
</html>

幸運を！

于 2012-12-19T18:35:28.213 に答える
0

PHP配列（サーバー側）をJavascript（クライアント側）に取得します

これを行うにはかなりの数の方法がありますが、 JSONをお勧めします。これには多くの利点がありますが、最も明白なのは、配列とjavascriptオブジェクトを文字列として格納できることです。慣れていない場合は、Javascriptを処理する必要があることを考えると、ワークフローに含めるのに最適な時期です。

PHP

  1. 配列をJSONに変換します。

    $jsonResults = json_encode($arrayOfResults);

  2. PHPからJavascriptにJSONを取得します。 

    <script>
    var myAppsData = {};
    myAppsData.slideshowJSON = JSON.parse($jsonResults);
</script>

これで、JSONオブジェクトにでJavascriptにアクセスできるようになりましたmyAppsData.slideshowJSON。

残りの作業は、forループを使用してオブジェクトを反復処理し（PHPの場合と同じように）、コンテンツを取得して必要な処理を実行するのと同じくらい簡単です。

乾杯！

于 2012-12-19T18:45:03.650 に答える