dswm97353
2014-07-06 13:47
浏览 33
已采纳

如何在执行上一个代码后在javascript函数中调用另一个javascript函数?

I got this seemingly simple problem, yet I cannot find the correct way of execution.

I have 2 select tags, the first one is COLOR and the second one is SIZE. The second one is dependent on the first one.

To retrieve the price of the products (which is from the database), I intend to call a function within another function. The code stated below.

    function checksizes(id)
    {
    var color=document.getElementById('colors').value;
    $("#sizediv").show();
    $("#sizediv").load('sizes.php?id='+id+'&color='+color);
    var size = document.getElementById('size2').value;
    alert(id+size+color);
    confirmprice2(id,size,color);
    }

    function confirmprice2(id,size)
    {
    $("#price").show();
    $("#price").load('price.php?id='+id+'&size='+size);
    }

The alert is to check whether the invoked values to be passed on the next function are correct.

Code is working, but returning different results. It seemed that the function checksizes() passes values which are from the previous select (from the size). It calls the second function even before it finishes executing this: $("#sizediv").load('sizes.php?id='+id+'&color='+color);

Help is much appreciated. Thank you!

图片转代码服务由CSDN问答提供 功能建议

我遇到了这个看似简单的问题,但我找不到正确的执行方式。 \ n

我有2个选择标签,第一个是COLOR,第二个是SIZE。 第二个依赖于第一个。

要检索产品的价格(来自数据库),我打算在另一个函数中调用一个函数。 代码如下所示。

  function checksizes(id)
 {
 var color = document.getElementById('colors')。value; 
 $(“#sizediv  “)。show(); 
 $(”#sizediv“)。load('sizes.php?id ='+ id +'& color ='+ color); 
 var size = document.getElementById('size2  ')。value; 
 alert(id + size + color); 
 confirmmprice2(id,size,color); 
} 
 
函数confirmmprice2(id,size)
 {
 $(“# 价格“)。show(); 
 $(”#price“)。load('price.php?id ='+ id +'& size ='+ size); 
} 
  <  / pre> 
 
 

警告是检查要在下一个函数上传递的调用值是否正确。

代码正在运行,但会返回不同的结果。 似乎函数checksizes()传递的值来自前一个select(来自大小)。 它甚至在完成执行之前调用第二个函数:$(“#sizediv”)。load('sizes.php?id ='+ id +'&amp; color ='+ color);

非常感谢帮助。 谢谢!

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • douguan3470 2014-07-06 13:53
    已采纳

    That's because .load() is asynchronous. It basically forks off another thread to continue its work while the calling code continues what it was doing. If you have code which needs to happen in response to .load() then it needs to be placed in a callback function, not after the function. Something like this:

    function checksizes(id) {
        var color=document.getElementById('colors').value;
        $("#sizediv").show();
        $("#sizediv").load('sizes.php?id='+id+'&color='+color, function () {
            var size = document.getElementById('size2').value;
            alert(id+size+color);
            confirmprice2(id,size,color);
        });
    }
    

    Passing this function as a parameter to .load() will invoke this function after .load() completes.

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • dongqiongzheng0615 2014-07-06 13:53

    The load function is an asynchronous function. When the function is "finneshed" does not mean that the result is loaded. You need the completed Callback for that. See http://api.jquery.com/load/

    function checksizes(id)
    {
        var color=document.getElementById('colors').value;
        $("#sizediv").show();
        $("#sizediv").load('sizes.php?id='+id+'&color='+color, function(){
            var size = document.getElementById('size2').value;
            alert(id+size+color);
            confirmprice2(id,size,color);
        });
    }
    
    function confirmprice2(id,size)
    {
        $("#price").show();
        $("#price").load('price.php?id='+id+'&size='+size, function(){
            alert('price is loaded');
        });
    }
    
    评论
    解决 无用
    打赏 举报
  • drjmrg8766 2014-07-06 13:54

    As from the jQuery documentation, $.load does indeed not finish before it returns. You should use the callback function:

    $( "#result" ).load( "ajax/test.html", function() {
      alert( "Load was performed." );
    });
    

    http://api.jquery.com/load/

    In your case, everything in the checksizes function under the load function call should be placed in the callback.

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题