grouplink ui.grouplink
导航列表
详见http://www.kuaizhan.com/ui/ui-create
- 使用linkselect控件时会自动生成样式
- 所有linkselect控件需遵循这样的一个结构
呈现样式
具体效果可参见 http://www.kuaizhan.com/ui/ui-create
创建一个grouplink
使用接口 ui.grouplink 可以动态地创建一个链接选择控件
参数(以JS Object形式给出):
name: input hidden标签的name
value: input hidden标签的value
[
{
link: 当link_res_type为1表示链接url;当link_res_type为2、3时为空;当link_res_type为5、6时为相对地址
link_res_id: 如果为文章或者页面时,表示文章或者页面id,
link_res_type: 链接类型1表示URL,2表示文章,3表示页面,5表示电商,6表示论坛
link_res_name: 链接名称
},
...
]
示例代码:
//grouplink
var form = $("#js-form-grouplink"),
placeholder = form.find(".js-put-grouplink");
//生成链接列表的html
var html = ui.grouplink.create({
"nav_theme": "theme1",
"name": "links",
sortable: true,
min: 1,
max: 6,
"value": [
{
"title": "导航1",
"link": "javascript:;",
"link_res_type": 1,
"link_res_id": 0,
"link_res_name": "哈哈"
},
{
"title": "导航2",
"link": "javascript:;",
"link_res_type": 0,
"link_res_id": 0,
"link_res_name": "哈哈"
},
{
"title": "导航3",
"link": "javascript:;",
"link_res_type": 2,
"link_res_id": 0,
"link_res_name": "哈哈"
},
{
"title": "导航4",
"link": "javascript:;",
"link_res_type": 3,
"link_res_id": 0,
"link_res_name": "哈哈"
}
]
});
placeholder.replaceWith(html);
//绑定事件
ui.grouplink.init(form);
//数据处理
form.on("change", "input[name='links']", function(e, v) {
console.log(v);
});
