1

私がやろうとしているのは、ページ上のすべての価格を jquery、ajax、および Google 通貨で変換することです。

私はこれを見つけました、それはうまくいきます。

$('#submit').click(function(){
     //Get the values
     var amount = $('#amount').val();
     var from  = $('#from').val();
     var to = $('#to').val();
     var params = "amount=" + amount + "&from=" + from + "&to=" + to ;

     $.ajax({
       type: "POST",
       url: "currency-converter.php",
       data: params ,
       success: function(data){
            $('#converted_value').html(amount + from +" is equal to : " +data);

       }
     });
    }) ;

これをページの div クラスに適用するにはどうすればよいですか? priceEuro クラスがあるとしましょう。

<div class="product">
      <div class="priceEuro"><?php the_field('price1'); ?></div>
</div>

<div class="product">
      <div class="priceEuro"><?php the_field('price2'); ?></div>
</div>

<div class="product">
      <div class="priceEuro"><?php the_field('price3'); ?></div>
</div>

今、私はすべての異なる価格を変換し、結果をこのような製品に追加したいと考えています.

$('.priceEuro').each(function () {

                         var amount = $(this).val();
             var params = "amount=" + amount + "&from=EUR" + "&to=USD" ;

             $.ajax({
               type: "POST",
               url: "currency-converter.php",
               data: params ,
               success: function(data){
                $(this).append("<div class="priceUsd">'+ data +'</div>");

               }
             });

これらの方法が正しくないことはわかっていますが、解決策は何ですか？ありがとう。

@UnTechie のおかげで、結果が得られるようになりました。

$(document).ready(function() {

    $.each($('.priceEuro'), function () {

     var amount = $(this).text();
     var dataString = "amount=" + amount + "&from=EUR" + "&to=USD";

         $.ajax({
           type: "POST",
           url: "chalo/themes/chalo/ajax_converter.php",
           data: dataString,
           success: function(data){
                console.log(data);
                $(this).append('<div class="priceUsd">'+ data +'</div>');
           }
         });
    });

});

しかし、各 div の後にこれらの結果を追加できませんでした。これは間違っていますか?

$(this).append('<div class="priceUsd">'+ data +'</div>');

わかりました、私は問題を見つけました。thisajax コールバックで自動的に適切なオブジェクトへの参照になるわけではありません。

今ではこのように機能しています。

$(document).ready(function() {

    $.each($('.priceEuro'), function () {
     var $this = $(this);
     var amount = $(this).text();
     var dataString = "amount=" + amount + "&from=EUR" + "&to=USD";

         $.ajax({
           type: "POST",
           url: "chalo/themes/chalo/ajax_converter.php",
           data: dataString,
           success: function(data){
                console.log(data);
                $this.append('<div class="priceUsd">'+ data +'</div>');
           }
         });
    });

});
4

1 に答える 1

1

jquery.each( http://api.jquery.com/jQuery.each/ )を使用する必要があります。

これはあなたのコードがどのように見えるべきか..

$.each($('.priceEuro'), function () {
 //Your code goes here ... Use $(this) to access each element

});
于 2013-05-13T12:58:29.560 に答える