删除“alert()”时,我的代码停止工作

时间:2013-07-08 08:05:55

标签: javascript jquery

我有一个非常奇怪的(对我来说)javascript问题。我正在开发一个页面,在这样做的过程中,我抛出了几行代码来帮助我调试。然后,我把一切都搞定了。呜啊,对吗?没那么快一旦我取出警报(代码没有其他更改),我的代码就会失败。变量返回未定义。没有合理的理由我能想出这会导致这种情况。有人有主意吗?这是相关代码...以下工作,但当然会弹出警报:

function videoDone() {
$.ajax({url:"getNextTrack.php",success:function(result){

  foo = result;
   }});
   alert(foo);
    document.getElementById("myVideo").src = foo;

上面的代码工作正常。它通过jquery ajax加载下一个音轨,并将视频源设置为该音轨。快乐的时光。但是,如果我不做任何其他操作,只需删除警报并将代码更改为:

function videoDone() {
$.ajax({url:"getNextTrack.php",success:function(result){

  foo = result;
   }});

    document.getElementById("myVideo").src = foo;

然后foo回来未定义。这对我来说没有意义。没有其他改变

2 个答案:

答案 0 :(得分:10)

在脚本中,代码进行Ajax调用,这是一个异步调用,这意味着您的代码在调用时继续执行。在代码中,document.getElementById...行依赖于Ajax调用返回的数据。当警报未到位时,在ajax调用完成之前调用document.getElementBy..语句。

当到位时,警报暂停通话,足以让ajax呼叫完成。删除警报时,在Ajax调用返回之前执行调用以获取元素并设置src属性。这会导致foo未定义。

只需包含代码,即在ajax调用完成后执行的回调函数中设置src属性。

function videoDone() {
$.ajax({url:"getNextTrack.php",success:function(result){
    document.getElementById("myVideo").src = result;
 }});

简而言之,这是发生的事情:

无警报

  
      
  1. Ajax call fires
  2.   
  3. document.getElementById ...执行,抛出错误
  4.   
  5. Ajax调用返回
  6.   

有警告

  
      
  1. Ajax call fires
  2.   
  3. 显示警报窗口,暂停代码执行
  4.   
  5. Ajax调用返回填充所需的变量
  6.   
  7. document.getElementById ...执行,没有错误
  8.   

答案 1 :(得分:0)

Ajax调用是异步的,因此代码将继续运行。所以在你的第一个例子中,foo有时间由“result”设置,但是在你的第二个例子中它没有,因为.src是直接设置的。

试试这个:

function videoDone() {
$.ajax({url:"getNextTrack.php",success:function(result){

  foo = result;
  document.getElementById("myVideo").src = foo;
}});