基于jQuery实现仿淘宝套餐选择插件.pdf

本文给大家介绍的是一款基于 jQuery 实现放淘宝套餐选择的插件， 主要是基于本地 json 数据的选择列创建，有需要的小伙伴参考下。 基于 jQuery 实现仿淘宝套餐选择插件 首先是页面 HTML 代码 代码如下 : <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="./option-jquery-dc.js"></script> <link rel="stylesheet" href="css/option-jquery-dc.css"/> <!-- lang: html --> <div><dt> 本 地 调 用 </dt><dd class="tb-prop testlocal"></dd><br/></div><div><dt>ajax 调 用 </dt><dd class="tb-prop testajax"></dd></div> 然后调用的 js 代码如下 : <!-- lang: js --> <script> /************************************ * 基于本地 json 数据的选项列创建 ****************************************/ var datanodes=[ {text:" 官方标配 ",value:"1",selected:true}, {text:" 套餐一 ",value:"2"}, {text:" 套餐二 ",value:"3"}, {text:" 套餐三 ",value:"4"}, {text:" 套餐四 ",value:"5"}, {text:" 套餐五 ",value:"6"}, {text:" 套餐六 ",value:"7"}, {text:" 套餐七 ",value:"8"}, {text:" 套餐八 ",value:"9"}, {text:" 套餐九 ",value:"10"} ]; /** * @type {mylist} * @param className 容器支撑层的 css 名称 * @param 用户点击后调用的回调函数 由开发者自定义 */ var mylistobjLocal=new OptionList("testlocal","mycall"); mylistobjLocal.createListHtml(datanodes); /************************************ * 基于远程服务器的 json 数据的选项列创建 * @type {mylist} * @param className 容器支撑层的 css 名称 * @param 用户点击后调用的回调函数 由开发者自定义