2013-03-26 25 views
0

每次用户单击“Get Quote”按钮时,都会显示GIF动画并隐藏旧显示。JQuery只在执行前如果在它之前放置了Alert()

我查询了一个后端服务,它返回了一些我刚刚转储到页面上的HTML(我利用API中的SMARTY来处理我的糟糕的前端技能的格式)。当发生错误时,而不是HTML,JSON被返回(因此有点向后尝试捕获,在这种情况下,“成功”发生在“catch”中,而“失败”发生在“try”中)。

发生错误时,HandleMessages()获取响应,并处理存储在那里的消息(这很好地工作)。 处理完错误之后,GIF应该消失(因为它在.collapse中,我隐藏它)。这不会发生,只有当我向页面发出警告()时才会发生。如果alert()被注释或丢失,这不起作用。

我确定这是超级愚蠢或愚蠢的东西,但你的帮助总是很感激。

下面的代码:

$('#findCarriers').click(function(){ 

    var data = new Object(); 

    $('#carrierLoad').collapse('show'); 
    $('#carriers').collapse('hide'); 

    data.general = { 
     'code': $('#warehouse').val(), 
     'shipper': $('#shipper_zip').val(), 
     'consignee': $('#consignee_zip').val(), 
     'shipment_type': $('#direction').val(), 
     'total_weight': $('#total_weight').text(), 
    }; 

    data.accessorials = []; 

    $('#accessorials').find('input:checkbox:checked').each(function(acc_index){ 

     data.accessorials.push($(this).val()); 

    }); 

    data.units = [{ 
     'num_of': $('#total_pallets').val(), 
     'type': 'pallet', 
     'weight': 0 
    }]; 

    data.products = []; 

    $('#items tr').each(function(index){ 

     data.products.push({ 
      'pieces': 1, 
      'weight': parseFloat($(this).find('.weight').val(), 10), 
      'class': parseInt($(this).find('.class').val(), 10) 
     }); 

    }); 

    $.post('index.php?p=api&r=html&c=ctsi&m=lcc', data, function(resp){ 
     try { 

      resp = $.parseJSON(resp); 
      handleMessages(resp); 

      carriersClear('find carriers'); 
      alert('good'); // comment out or remove and the show and hide on the collapse never happens 
      $('#carrierLoad').collapse('hide'); 
      $('#carriers').collapse('show'); 
     } catch(err) { 

      $('#carriers').html(resp); 
      alert('fail'); // comment out or remove and the show and hide on the collapse never happens 
      $('#carrierLoad').collapse('hide'); 
      $('#carriers').collapse('show'); 

     } 

    }); 

    return false; 

}); 

辅助功能:

function setError(e_title, e_msg, e_type) { 

    $.pnotify({ 
     title: e_title, 
     text: e_msg, 
     type: e_type 
    }); 

} 

function handleMessages(jsResponse) { 

    $.each(jsResponse.message, function(){ 

     setError(this.traceroute[0] + '-' + this.traceroute[1] + '-' + this.traceroute[2], this['message'], this['type']) 

    }); 

} 

function carriersClear(reason) { 

    $('#carriers').html(''); 

    //alert(reason); 

} 

这里是HTML:

<div class="row"> 

<div class="span10"> 

    <h3 class="heading" data-toggle="collapse" data-target="#carrierSelect">Carriers</h3> 

    <div class="bg-light collapse in bg-light" id="carrierSelect"> 

     <div class="row spacer-top spacer-bottom"> 

      <div class="span2 offset8"> 
       <a href="#" class="btn btn-primary" id="findCarriers">Get Quote</a> 
      </div> 

     </div> 

     <div class="row spacer-bottom collapse" id="carrierLoad"> 
      <div class="span2 offset4"><img class="center-block" src="view/img/load.gif" /></div> 
     </div> 

     <div class="row"> 

      <div class="span10 bg-x-light collapse in spacer-top" id="carriers"> 

      </div> 

     </div> 

    </div> 

</div> 

+4

如果某样东西时用一个'警报()',那就是你有一些异步行动正在进行一个明确的信号,并且该警示使得延迟不所有的区别。 – adeneo 2013-03-26 17:09:42

+0

'handleMessages()'和'carriersClear()'的代码在哪里? – JJJ 2013-03-26 17:11:09

+0

你能否详细说明。我对jQuery基本没用,所以说明会很棒,建议的修复也会很棒。 – DavidScherer 2013-03-26 17:11:26

回答

0

你需要传递carriersClear后的行()进入th e运营商清算功能作为回调。像这样:

$.post('index.php?p=api&r=html&c=ctsi&m=lcc', data, function(resp){ 
    try { 

     resp = $.parseJSON(resp); 
     handleMessages(resp); 

     carriersClear('find carriers', function(){ 
      $('#carrierLoad').collapse('hide'); 
      $('#carriers').collapse('show'); 
     } 
    } 

则:

function carriersClear(reason,callback) { 
    $('#carriers').html(''); 
    callback(); 
} 
+0

感谢伴侣,作品像一个魅力。 :) – DavidScherer 2013-03-26 18:59:43

+0

经过更多的修补之后,我实际上将它连接在引导程序崩溃事件的周围,但你让我在我的路上设置。 – DavidScherer 2013-03-28 02:18:38

相关问题