0

コードのブロックに問題があります。このセクションでは、前のステップでユーザーが選択したものと、API スクリプトでデータベースから取得したデータに基づいて、チョコレートの箱を作成します。問題は、alert('hi') がないと機能しないことです。それを取り出すと、フレーバーをドロップせずに空のボックスが作成され、フレーバーは createFlavorArray 関数で挿入されます。

var product = new Array();
var price = new Array();
var size = new Array();

$(function () {
      $.ajax({
        type: 'POST',
        url: 'phpscripts/api.php',      
        data: "",
        dataType: 'json',    
          success: function(rows)        
        {
        count = 0;
          for (var i in rows)
          {
            var row = rows[i];          
              product[count] = row[0];
              price[count] = row[1];
              size[count] = row[2];
              count++;
          }
        } 
      });
    });

//b = box
//o = option that is inside the box
//nextBoxId is the box id
//nextFlavorId is the option or flavor id

var nextBoxId = 1;
var nextFlavorId = 1;
var orderCap = 0;
var subTotal = 0;
var numOfChocolates = 0;
var numOfBoxes = 0;

$(document).ready(function(){

    while (halfPoundBoxes > 0) {
            $("#boxes").append('<div id="b'+nextBoxId+'"></div>');
            $('#b'+nextBoxId).addClass('div-table-selection');
            $('#b'+nextBoxId).append($('#minusBox').clone().attr('id', "m"+nextBoxId));
            $('#b'+nextBoxId).append('<div style="display:table-row"></div>');

            //call the function to loop through and create the number of flavor options needed
            var x = 0;
            alert('hi');
            while(x < product.length){
                if ('1/2lb Box' == product[x]) {
                    createFlavorArray(size[x], nextBoxId);
                    subTotal += price[x] * 1;
                    $('#b'+nextBoxId).attr('title', product[x]);
                }
                x++;

            }
            //clone the delete box button and make it visible

            $('#m'+nextBoxId).show(500);
            $('#b'+nextBoxId).append("<br />");

            if (orderCap == 0) {
            $('#boxes').append('<div id="msg"><p>If you wish to add another box to your order select the size and click +1 Box.</p></div>');
            }

            $("#m"+nextBoxId).click(function() {
                    $(this).parent().remove();
                orderCap--;
                //if they're ordering zero boxes hide the order button
                //remove total price
                //remove the message
                if (orderCap == 0)
                {
                    document.getElementById('orderBtn').style.display = "none";
                    $("#msg").remove();
                    $("#totalPrice").empty();
                }
                if (orderCap < 10)
                {
                    $("#cap").remove();
                    $("#addBox").show(500);
                }
                var y = 0;
                while (y < product.length) {
                    if ('1/2lb Box' == product[y]) {
                    subTotal -= price[y] * 1;
                    numOfChocolates -= size[y] * 1;
                    }
                    y++;
                }
                $('#totalPrice').html("<p>Sub Total: " + subTotal + "</p>")
                //subtract the new
                $('#finalpaypal').val(subTotal);

            });
            nextBoxId++;
            orderCap++;
            numOfBoxes++;
            $('#totalPrice').html("<p>Sub Total: " + subTotal + "</p>")
            halfPoundBoxes--;   
    }
4

3 に答える 3

4

を使用している場合にのみコードが機能する理由alert()は、alert()アクションがjQuery AJAXリクエストに数秒を与えて、success()コールバック関数に値を返すためです。

このコードが正しい順序で実行されるように、callout関数の影響を受けるコードをcallout関数にも移動する必要があります。


または、を追加してAJAXリクエストを非同期で実行することはできませんasync:falseが、@ Rocketがコメントしているように、これはお勧めしません。

$.ajax({
  async: false,
于 2012-08-15T19:56:09.977 に答える
0

ajaxから返されたマークアップを操作しようとしているようです。そのコードは、ajaxリクエストの成功コールバックに移動する必要があります。アラート呼び出しが機能する理由は、ページの読み込みが完了するのに十分な時間、他のすべてを遅らせるためです。

于 2012-08-15T19:56:25.827 に答える
0

コードを関数に入れ、ajax の成功が完了した後に実行する必要があります。

...
$(function () {
  $.ajax({
    type: 'POST',
    url: 'phpscripts/api.php',      
    data: "",
    dataType: 'json',    
      success: function(rows)        
    {
    count = 0;
      for (var i in rows)
      {
        var row = rows[i];          
          product[count] = row[0];
          price[count] = row[1];
          size[count] = row[2];
          count++;
      }
      do_after_ajax();
    } 
  });
});

function do_after_ajax(){
        while (halfPoundBoxes > 0) {
        $("#boxes").append('<div id="b'+nextBoxId+'"></div>');
        $('#b'+nextBoxId).addClass('div-table-selection');
        ....
}
于 2012-08-15T20:06:56.733 に答える