Question

我正在尝试在此链接上进行简单的使用

http://www.appelsiini.net/projects/chained

但第二个下拉列表仍显示所有选项。这是我的代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="jquery.chained.js"      charset="utf-8"></script>
<script>
if (jQuery().chained) {  
alert('jQuery is loaded!');  
}
else{  
alert('jQuery is not loaded!');  
}
</script>

<select id="mark" name="mark">
<option value="">--</option>
<option value="bmw">BMW</option>
<option value="audi">Audi</option>
</select>
<select id="series" name="series">
<option value="">--</option>
<option value="series-3" class="bmw">3 series</option>
<option value="series-5" class="bmw">5 series</option>
<option value="series-6" class="bmw">6 series</option>
<option value="a3" class="audi">A3</option>
<option value="a4" class="audi">A4</option>
<option value="a5" class="audi">A5</option>
</select>

<script language="JavaScript" type="text/javascript">
$("#series").chained("#mark");
</script>

</html>

Answer 1

Document.ready将在DOM完成加载时调用方法。

将您的代码包装在document.ready function

中

$(function(){
if (jQuery().chained) {  
alert('jQuery is loaded!');  
}
else{  
alert('jQuery is not loaded!');  
}
})

Answer 2

我建议您查看是否加载了jquery，或者尝试使用cdn托管的jquery，如下所示：

 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

这应该有效：

<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js">
      </script>
      <script type="text/javascript" src="jquery.chained.js" charset="utf-8"></script>
      <script>
         if (jQuery().chained) {  
              alert('jQuery is loaded!');  
         }
          else{   
             alert('jQuery is not loaded!');  
         }
      </script>
   </head>
   <body>
      <select id="mark" name="mark">
           <option value="">--</option>
           <option value="bmw">BMW</option>
           <option value="audi">Audi</option>
      </select>
      <select id="series" name="series">
           <option value="">--</option>
           <option value="series-3" class="bmw">3 series</option>
           <option value="series-5" class="bmw">5 series</option>
           <option value="series-6" class="bmw">6 series</option>
           <option value="a3" class="audi">A3</option>
           <option value="a4" class="audi">A4</option>
           <option value="a5" class="audi">A5</option>
      </select>

      <script language="JavaScript" type="text/javascript">
          $("#series").chained("#mark");
      </script>

  </body>
  </html>

您在文档中遗漏的内容是</head> <body></body>，试试这个或添加这些标签并查看。

jquery chained选择不工作

2 个答案: