<ul><li></li></ul>标签问题
如题,我想用<ul><li></ul></li>标签实现select那种效果,请问要怎么实现?
就是比如这样
1
2
3
4
5
|
< ul > < li >张三</ li > < li >李四</ li > < li >王五</ li > </ ul > |
当我选中的是张三时后台获取的是001这个值,选中李四时获取的是002这个值,选中王五时获取的是003这个值,
请问要怎么实现
用select写的话我知道,就是
1
2
3
4
5
|
< select > < option value = "001" >张三</ option > < option value = "002" >李四</ option > < option value = "003" >王五</ option > </ select > |
但是用<ul><li>不知道怎么写
问题已经解决了 ,谢谢各位,解决代码如下:
1
2
3
4
5
6
7
8
9
10
|
< div class = "ddl collapse driver cover-3" > < input type = "hidden" id = "driverId" name = "driverId" value = "" /> < input type = "text" placeholder = "" readonly> < ul > < li data-value = "001" >张三</ li > < li data-value = "111111" >李四</ li > < li data-value = "12345678910" >哈哈</ li > < li data-value = "你好" >哇哈哈</ li > </ ul > </ div > |
1
2
3
4
5
6
7
8
9
10
|
$(document).ready( function () { 'use strict' ; var $driver = $( '.driver' ), $list = $driver.children( 'ul' ); $list.delegate( 'li' , 'click' , function () { var $ this = $( this ); $driver.value = $ this .attr( 'data-value' ); //alert($driver.value); //alert($this.attr('data-value')); }); }); |