Question

我试图在这里遵循指南 http://www.appelsiini.net/projects/chained

用于链接多个选择框，但我对javascript和一切前端都很新。

我以为我通过创建以下HTML文件来复制他的示例，但它没有按预期工作。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

    <head>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.chained.min.js"></script>

<script charset=utf-8>
  $(function(){
      $("#series").chained("#mark");
  });
  </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>






  </body>
</html>

Answer 1

在提交此类问题时，通常会包含一个jsfiddle。见my example here，哪个有效。如果你想出一个不起作用的例子，向我们展示一个jsfiddle，我们可以提供更好的帮助。

如果我不得不猜测，我会说你的脚本路径错了。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.chained.min.js"></script>

Answer 2

更改具有数据链的类选项子级，如下所示：

<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" data-chained="bmw">3 series</option>
  <option value="series-5" data-chained="bmw">5 series</option>
  <option value="series-6" data-chained="bmw">6 series</option>
  <option value="a3" data-chained="audi">A3</option>
  <option value="a4" data-chained="audi">A4</option>
  <option value="a5" data-chained="audi">A5</option>

Jquery Chained Select

2 个答案: