Javascript脚本失败并显示警报

时间:2012-10-10 13:07:31

标签: javascript jquery alert

我有以下代码:

$(".zalen").change(function(){
        var number = $(this).val(); 
        $('.Zaal').load('zaal'+ number +'.html');

        var storageName = "zaal" + $(".zalen").val() + '_chairs';
        var chairs = localStorage.getItem(storageName);
        if(chairs == null)
        {
            chairs = "";
        }
        var chairArray = chairs.split(" "); 
        alert(chairArray);
        $("td.chair").each(function(index){
            for(var i=0; i < chairArray.length; i++)
            {
                if(index == chairArray[i])
                {
                    $(this).addClass('reserved');   
                }
            }
        })
    });

请注意分开椅子后的警报。

它与警报完美配合。但是,我完成了测试并删除了警报。代码停止工作,我不知道为什么会这样做。

任何人都可以帮我解决这个问题。

解决方案:

$(".zalen").change(function(){
        var number = $(this).val(); 
        $('.Zaal').load('zaal'+ number +'.html', function() {
            var storageName = "zaal" + $(".zalen").val() + '_chairs';
            var chairs = localStorage.getItem(storageName);
            if(chairs == null)
            {
                chairs = "";
            }
            var chairArray = chairs.split(" ");  
            $("td.chair").each(function(index){
                for(var i=0; i < chairArray.length; i++)
                {
                    if(index == chairArray[i])
                    {
                        $(this).addClass('reserved');   
                    }
                }
            })
        });
    });

谢谢@jbabey的解决方案。我非常感激

1 个答案:

答案 0 :(得分:4)

jquery的load()函数执行内容的异步请求。你需要等到内容准备好后再采取行动。当您收到警报时,代码暂停的时间足以使load完成。任何依赖于加载到.Zaal的内容的代码都应该在load的成功处理程序中:

$(".zalen").change(function(){
    var number = $(this).val(); 
    $('.Zaal').load('zaal'+ number +'.html', function () {
        // put all of this in the complete callback
        var storageName = "zaal" + $(".zalen").val() + '_chairs';
        var chairs = localStorage.getItem(storageName);
        if(chairs == null) {
            chairs = "";
        }
        var chairArray = chairs.split(" "); 
        alert(chairArray);
        $("td.chair").each(function(index){
            for(var i=0; i < chairArray.length; i++) {
                if(index == chairArray[i]) {
                    $(this).addClass('reserved');   
                }
            }
        })
    });
});