来自谷歌CDN的jQuery无法正常工作

时间:2013-09-28 20:14:13

标签: javascript jquery html

我想在我的网页中使用jQuery。我不想下载它,所以我将它包含在谷歌的CDN中。

当我运行页面时,jQuery无效。

任何人都可以告诉我这个问题是依赖于jQuery还是我的代码。

这是我的代码。

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script>
cars=new Array("Mercedes","Volvo","BMW","porche");
phones=new Array('Samsung','Nokia','Iphone');

populateSelect();

$(function() {

  $('#cat').change(function(){
    populateSelect();
});

});


function populateSelect(){
cat=$('#cat').val();
$('#item').html('');


if(cat=='car'){
    cars.forEach(function(t) { 
        $('#item').append('<option>'+t+'</option>');
    });
}

if(cat=='phone'){
    phones.forEach(function(t) {
        $('#item').append('<option>'+t+'</option>');
    });
}

} 
</script>
</head>

<body>
<select id="cat">
<option value="car">car</option>
<option value="phone">phone</option>
</select>

<select id="item">

</select>
</body>
</html>

1 个答案:

答案 0 :(得分:3)

你调用populateSelect(),当DOM尚未加载时,它会尝试访问你的select标签。

将函数调用移动到DOM Ready事件处理程序中:

$(function() {
  populateSelect();

  $('#cat').change(function(){
    populateSelect();
  });
});

下次打开浏览器的开发者控制台!它会清楚地显示错误。