jquery.chained与jquery.chained.remote使用以及区别

标签：

---恢复内容开始---

jquery.chained与jquery.chained.remote总体来说一个是静态的一个是动态的，

jquery.chained是静态的，他可以显示和隐藏页面上select的选项，他是根据类来显示select的数据项

例如：

<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>

实例：$("#series").chained("#mark"); /* or $("#series").chainedTo("#mark"); */

　　$("#series").chained("#series, #model");可以根据两个参数来显示数据项

jquery.chained.remote则是动态的取数据

实例：

$("#model").remoteChained({
    parents : "#series",//联动参数
    url : "/api/model.json"//ajax读取地址
});

$("#engine").remoteChained({
    parents : "#series, #model",//多个参数
    url : "/api/engine.json"
});

$("#engine").remoteChained({
    parents : "#engine, #model",
    url : "/api/series.json",
    loading : "Loading..."
});

注意：默认返回数据格式如下，但是这样客户端会自动来排序

{
  "" : "--",
  "series-1" : "1 series",
  "series-7" : "7 series",
  "series-6" : "6 series",
  "series-3" : "3 series",
  "series-5" : "5 series",
  "selected" : "series-6"
}

客户端自动排序为：

{
  "" : "--",
  "series-1" : "1 series",
  "series-3" : "3 series",
  "series-5" : "5 series",
  "series-6" : "6 series",
  "series-7" : "7 series",
  "selected" : "series-6"
}

如果不想被从新拍下，

返回格式如下：

[
  [ "", "--" ],
  [ "series-1", "1 series" ],
  [ "series-3", "3 series" ],
  [ "series-5", "5 series" ],
  [ "series-6", "6 series" ],
  [ "series-7", "7 series" ],
  [ "selected", "series-6" ]
]

或者

[
  { "" : "--" },
  { "series-1" : "1 series" },
  { "series-3" : "3 series" },
  { "series-5" : "5 series" },
  { "series-6" : "6 series" },
  { "series-7" : "7 series" },
  { "selected" : "series-6" }
]

---恢复内容结束---

jquery.chained与jquery.chained.remote使用以及区别

标签：

原文地址：http://www.cnblogs.com/ImNo1/p/5057622.html