2016-05-07 9 views
1

私はウェブ開発者として全く新しいです。問題を解決しようとしています。JavaScriptにJavaScriptの値を渡す

フォームメソッドを使用せずに値JavaScriptをPHPに渡したいと思います。

私のPHPコード(onclickイベントをクリックした画像のIDを取得するためにimgタグに入れたスライドショーです.IID情報はJavaScriptファイルの変数に保存されています)質問は、JavaScriptファイルからその変数をPHPに渡すにはどうすればいいですか?):

ありがとうございます。 敬具、

function getIdImage(clicked_id) 
{ 
    // alert(clicked_id); 

    var ClickedId= clicked_id; 

    } 
<div class="row"> 
    <div class="col-xs-12 col-md-12 col-lg-12 widhest"> 
    <div class="bx_wrapper_photo_below"> 
     <ul id="bx_slider_photo_below" class="bx_viewport_photo_below"> 

     <?php while($line = mysqli_fetch_assoc($outcomesListPhotos1)) {?> 
      <li> 
        <img src="photos/<?php echo utf8_encode($line['photo']); ?>" class="img-responsive" onclick="getIdImage(<?php echo utf8_encode($line['id_photo']);?>)">     
      </li> 

     <?php }?> 
     </ul> 

     <a class="pager-prev_below"><i class="icon-chevron-left"></i></a> 
     <a class="pager-next_below"><i class="icon-chevron-right"></i></a> 
    </div> 
    </div> 
</div> 

あなたはコメントで述べたように、あなたがAJAX使用することができ、あなたのデータを保持する要求を送信する必要がファビオ

+0

必要なものは 'ajax'です。 –

+0

あなたはajaxまたは通常のページの再読み込みを行いたいですか? –

+0

あなたが欲しいもの。ここであなたはあなたが望むものの後にPHPからjsに画像IDを渡しますか?適切に説明してください。 –

答えて

0

。ここで

はjQueryのAJAXの例:

$.ajax({ 
    url: "test.html", 
    context: document.body 
}).done(function() { 
    // Available informations 
}); 
2

あなたは、標準セットアップを使用している場合は、あなたのPHPコードは、要求がサーバーに行われるたびに最初から最後まで実行されます。あなたのページにあるJavascriptコードのように「オンデマンドで」実行されることはありません。したがって、PHPスクリプトに値を渡すには、要求ペイロード内に目的の値を渡す要求(PHPコードが存在する)をサーバーに送信する必要があります。リクエストは、単純なリンク、通常のフォームまたはXHRを通じて送信できます。ページをリロードするのではなく、サーバー上でコードを実行したい場合は、ブラウザでいくつかのことをしてから、選択したツールがXHRです。

XHRを送信するには、ゼロから自分で構築するか、そこから入手できる多数のライブラリの1つを使用することができます(これはもちろん推奨ルートです)。あなたはjQueryのを使用したいとしましょう:あなたのサーバー上で

function getIdImage(clicked_id) 
{  
    jQuery.ajax({ 
     url: '/url/to/my/script.php', 
     type: 'POST', 
     dataType: 'json', 
     data: { clicked_id: clicked_id }, 
     success: function(result) { 
      // This function will be called when the server returns a success (200 OK) response 
      console.log(result); 
      alert('Yay!'); 
     }, 
     error: function(xhr) { 
      // This function is called when the server fails to process the request, for whatever reason 
      console.log(xhr); 
      alert('Nay!'); 
     } 
    }); 
} 

あなたは、この要求は、URLで指さ1を処理するためのスクリプトがあるでしょうし、あなたが渡されたどんなペイロード使用することができますこの例はあまりないだろう要求もちろん

<?php 

$data = json_decode($_POST); 

echo "The ID of the clicked image is: " . $data->clicked_id; 

でスクリプトに、それだけでエコー文字列の応答を返します。あなたがやりたいことに応じて、意味のある計算をした後にレスポンスを作成する必要があります。レスポンスはおそらくJSON形式(good old json_encode組み込みのPHP関数を使用しています)でなければなりません。

0

フォームを使用して変数を渡すことができます。フォーム以外のPHP変数を渡す方法は他にありません。

 <form id="WOW" action="" method="get"> 
     <input id="Num" name="clicked_id" type="hidden" value=""/> 
     </form> 


     <script type="text/javascript"> 
     $(document).ready(function){ 
      $('#WOW').submit(function(event){ 
       event.preventDefault(); 
       $data = $('#WOW').serialize(); 
       $url = $('#WOW').attr('action'); 
       //your variable is posted to that file! 
       $.post($url,$data,function(data){ 
       console.log('Veriables sent! and data recieved is:' + data); 
       }); 
      }); 
     }); 

     function getIdImage(clicked_id) 
     { 
      $('#Num').val(clicked_id); 
      $('#WOW').submit(); 
    } 
    </script>