zoukankan      html  css  js  c++  java
  • 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" }
    ]

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

  • 相关阅读:
    【HTML5】元素<script>与<noscript>的使用
    【HTML5】元素<head>的使用
    【HTML5】交互元素menu&command元素
    【HTML5】summary交互元素
    【HTML5】用脚本控制交互元素details元素的使用
    【BIEE】页面跳转以及跳转后返回
    (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作
    哪些年是闰年
    工程师职称评定条件
    linux 网络编程-基础篇01
  • 原文地址:https://www.cnblogs.com/ImNo1/p/5057622.html
Copyright © 2011-2022 走看看