JQuery second-level linkage plug-in: jQuery. selected
A page can reference multiple linkage effects. Usage:
Configure js:
1 var defaults = {
2 NextSelId: '# Select2 ',
3 SelTextId: '# text1 ',
4 Separator :'--',
5 SelStrSet :[
6 {name: 'select ', subname:' select '},
7 {name :'★High startup★', Subname: 'computer Science and Technology | Chinese Language and Literature '},
8 {name :'★Master★', Subname: 'language education | secretarial | preschool education | Tourism Management | Legal Affairs | economic management | accounting computerization | E-Commerce | computer information management | Software Engineering | mechatronics | fine chemical production technology | machinery manufacturing design and automation | broadcasting and hosting | Art Design | Calligraphy Art Design '},
9 {name :'★Exclusive version★', Subname: 'ideological and Political Education | Chinese Language and Literature | English | mathematics and Applied Mathematics | Electronic Information Engineering | Computer Science and Technology | accounting | Public Utilities Management | Tourism Management | Physical Education | musicology | Art Design | calligraphy direction Art Design '}]
10}
11
12 var defas2 S2 = {
13 NextSelId: '# Select4 ',
14 SelTextId: '# text2 ',
15 Separator :'★',
16 SelStrSet :[
17 {name: 'select ', subname:' select '},
18 {name: 'beijing', subname: 'beijing1 | beijing2 '},
19 {name: 'shanghai', subname: 'shanghai1 | shanghai2 | shanghai3 | shanghai4 '},
20 {name: 'tianjin ', subname: 'tianjin'}]
21}
Configuration instructions:
NextSelId: ID of the drop-down list to be loaded together
SelTextId: display the ID of the selected text box
Separator: Split string of level 1 menu and level 2 menu
SelStrSet: configure the drop-down list
[{Name: 'select ', subname:' select '}]
Name: one-level drop-down option; subname: Two-level drop-down option. Separate multiple items with "|;
Html page:
1 <body>
2 <script type="text/javascript">
3 $(function () {
4 $('#Select1').selected(defaults);
5 $('#Select3').selected(defaults2);
6
7 });
8 </script>
9 <select id="Select1">
10 </select>
11 <select id="Select2">
12 </select>
13 <input id="Text1" type="text" />
14 <br />
15 <select id="Select3">
16 </select>
17 <select id="Select4">
18 </select>
19 <input id="Text2" type="text" />
20 </body>
Please leave a comment if you have any suggestions!
Complete JS Compression
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
