JQueryのAjaxコールが動作しないIfステートメント

Question

私のAjax呼び出しがifステートメントの内部で機能しない理由はありますか？私はJSやAjaxで多くの経験がないので、ここで根本的に何かをやっているかもしれません。

function filter(varType, varValue) { 
    var $products = $('#products'); 

    $.getJSON($SCRIPT_ROOT + '/filterSize/' + varValue) 

    .success(function (data) { 
     $products.empty(); // clear html from container 
     var elt0 = '<div class="page-content"><h1 id="shoes">Shoes</h1></div>'; 
     $products.append(elt0); 

     if (Object.keys(data.shoes).length === 0) { 
      none = '<span class="noresults">No results</span>'; 
      $products.append(none); 
     } 

     else { 
      var numItems = (Object.keys(data.shoes).length); 
      for (index = 0; index < numItems ; ++index) { 
       var elt1 = Flask.url_for("static", {"filename": data.shoes[index].img1}); 
       var elt2 = '<div id="item" class="col-md-4"><div class="products"><a href="shop/item/' + data.shoes[index].id + '"><h5>' + data.shoes[index].name + '</h5><img src="' + elt1 + '" alt="" width="200px" height="125px"></a></div>'; 
       $products.append(elt2); 
      } 
     } 
    }); 
} 

しかし、私はこれを行うとしたら、それは突然動作を停止：おかげ

は、作業jsの関数である

function filter(varType, varValue) { 
    var $products = $('#products'); 

    var x = 5 
    var y = 6 

    if (y > x) { 
     $.getJSON($SCRIPT_ROOT + '/filterSize/' + varValue) 
    } 

    .success(function (data) { 
     $products.empty(); // clear html from container 
     var elt0 = '<div class="page-content"><h1 id="shoes">Shoes</h1></div>'; 
     $products.append(elt0); 

     if (Object.keys(data.shoes).length === 0) { 
      none = '<span class="noresults">No results</span>'; 
      $products.append(none); 
     } 

     else { 
      var numItems = (Object.keys(data.shoes).length); 
      for (index = 0; index < numItems ; ++index) { 
       var elt1 = Flask.url_for("static", {"filename": data.shoes[index].img1}); 
       var elt2 = '<div id="item" class="col-md-4"><div class="products"><a href="shop/item/' + data.shoes[index].id + '"><h5>' + data.shoes[index].name + '</h5><img src="' + elt1 + '" alt="" width="200px" height="125px"></a></div>'; 
       $products.append(elt2); 
      } 
     } 
    }); 
} 

Answer 1

if (y > x) { 
      $.getJSON($SCRIPT_ROOT + '/filterSize/' + varValue) 

     .success(function (data) { 
      $products.empty(); // clear html from container 
      var elt0 = '<div class="page-content"><h1 id="shoes">Shoes</h1></div>'; 
      $products.append(elt0); 

      if (Object.keys(data.shoes).length === 0) { 
       none = '<span class="noresults">No results</span>'; 
       $products.append(none); 
      } 

      else { 
       var numItems = (Object.keys(data.shoes).length); 
       for (index = 0; index < numItems ; ++index) { 
        var elt1 = Flask.url_for("static", {"filename": data.shoes[index].img1}); 
        var elt2 = '<div id="item" class="col-md-4"><div class="products"><a href="shop/item/' + data.shoes[index].id + '"><h5>' + data.shoes[index].name + '</h5><img src="' + elt1 + '" alt="" width="200px" height="125px"></a></div>'; 
        $products.append(elt2); 
       } 
      } 
     }); 
} 

これは有効な構文です。あなたは括弧の中で.successを動かす必要があります。

Answer 2

あなたもすぐにif-文の中括弧を閉じました。

if (y > x) { 
    $.getJSON($SCRIPT_ROOT + '/filterSize/' + varValue) 
//} <-- TOO EARLY 
    .success(function (data) { 
     .... 
    }); 
} <-- SHOULD BE HERE INSTEAD 

if終了後e .success()コールバック。