There is a multi-choice requirement. I found this plug-in on the Internet: multiselect
Https://github.com/ehynds/jquery-ui-multiselect-widget
This plug-in is introduced on the csdn blog,Many children's shoes have asked this question. How can I obtain the selected value?? This is really a good problem, because I also found this problem while reading the demo, haha!
Let's briefly talk about this plug-in:
Jquery-multiselect is a Jquery-ui-based component system.
When using it, you must first import js and css related to jquery-ui.
Features
- You can click label to select a checkbox group.
- Header Options, such as full select/cancel all select/disable.
- Supports keyboard selection.
- Supports five different Event Callback functions.
- Displays selected items in the list and sets the maximum value.
- Easy to change location, gradient speed, scroll container height, link text, text box default content, etc.
Effect
Result code:
Option 1 Option 2 Option 3 Option 4 Option 5 Option 6 Option 7 Option 8 Option 9 Option 10 Option 11 Option 12
Code for calling the multiselect plug-in:
$ ("Select" "= select =" "select all" 'select none of '4'
There are a lot of parameters when you call multiselect. I 'd like to write a lot of details in the official documentation. You can read all those who know E.
Well, the following are our most important questions. How can we get the selected value?
The official document does not find a method to obtain the value of the selected item in the select control. I read its source code, which is 1.14pre. Not found.
But we can DIY this plug-in on our own! Simply put!
First, declare a variable to record the selected value list, and cut the graph:
Then we will find that there is an update method in the source code. This method is used to obtain the text of the user's selected items:
Then add a method to the Code:
MyValues:
OK. The DIY plug-in is complete. Below is the call on the page:
valuestr = $("#sela").multiselect("MyValues" }
Yeah, OK!
For the Diy code and Demo, see the attachment.