我有一个非常奇怪的(对我来说)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回来未定义。这对我来说没有意义。没有其他改变
答案 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;
}});
简而言之,这是发生的事情:
无警报
- Ajax call fires
- document.getElementById ...执行,抛出错误
- Ajax调用返回
醇>
有警告
- Ajax call fires
- 显示警报窗口,暂停代码执行
- Ajax调用返回填充所需的变量
- document.getElementById ...执行,没有错误
醇>
答案 1 :(得分:0)
Ajax调用是异步的,因此代码将继续运行。所以在你的第一个例子中,foo有时间由“result”设置,但是在你的第二个例子中它没有,因为.src是直接设置的。
试试这个:
function videoDone() {
$.ajax({url:"getNextTrack.php",success:function(result){
foo = result;
document.getElementById("myVideo").src = foo;
}});