Js achieves Select-level-2 Association in HTML, and jshtmlselect is linked

Source: Internet
Author: User

Js achieves Select-level-2 Association in HTML, and jshtmlselect is linked

After selection

Js Code

<Script language = "javascript" type = "text/javascript"> // defines the data Array fylxArray = new Array (); fylxArray [0] = new Array ("", ""); fylxArray [1] = new Array ("Car fee", "fuel fee | toll | repair fee"); fylxArray [2] = new Array ("house rental fee ", "Rent of branch offices | dormitory rent | project rent"); fylxArray [3] = new Array ("travel expenses", "meal fee | accommodation fee | transportation fee "); fylxArray [4] = new Array ("hospitality", "hospitality"); fylxArray [5] = new Array ("office fee", "office supplies fee | office fee "); fylxArray [6] = new Array ("traffic fee", "traffic fee"); fylxArray [7] = new Array ("traffic fee", "traffic fee "); fylxArray [8] = new Array ("taxi fare", "taxi fare"); fylxArray [9] = new Array ("labor fee", "labor fee "); fylxArray [10] = new Array ("communication fee", "communication fee"); fylxArray [11] = new Array ("Water Fee", "Water Fee "); fylxArray [12] = new Array ("electricity bill", "electricity bill | Employee Welfare fee"); fylxArray [13] = new Array ("conference fee", "conference fee "); fylxArray [14] = new Array ("Intermediary Service Fee", "Audit Fee | attorney fee | brokerage fee | Other"); fylxArray [15] = new Array ("express delivery fee ", "Express Delivery fee"); fylxArray [16] = new Array ("recruitment fee", "recruitment fee"); fylxArray [17] = new Array ("overtime fee ", "overtime meal fee"); fylxArray [18] = new Array ("bidding fee", "bidding registration fee | bidding fee "); fylxArray [19] = new Array ("printing binding fee", "printing fee | binding fee | file production fee"); fylxArray [20] = new Array ("advertising fee ", "booth fee | advertising fee | design fee | printing fee"); fylxArray [21] = new Array ("winning service fee", "winning service fee "); fylxArray [22] = new Array ("expert consulting fee", "expert consulting fee"); fylxArray [23] = new Array ("training fee", "training fee "); fylxArray [24] = new Array ("Print fee", "Print fee"); fylxArray [25] = new Array ("Employee Welfare fee", "Employee Welfare fee "); fylxArray [26] = new Array ("heating fee", "heating fee"); fylxArray [27] = new Array ("gas fee", "gas fee "); fylxArray [28] = new Array ("Health Check fee", "Health Check fee"); fylxArray [29] = new Array ("maternity hospitalization fee", "maternity hospitalization fee "); fylxArray [30] = new Array ("maternity allowance", "maternity allowance"); fylxArray [31] = new Array ("Medical Insurance", "Medical Insurance "); fylxArray [32] = new Array ("other", "other"); // select second-level interaction function getChild (currFylx) {// the currently selected billing method var currFylx_value = currFylx. options [currFylx. selectedIndex]. value; var currFylxid = currFylx. id. substr () // clear the charge subject drop-down menu // var currOption = document. getElementById (currFylxid + '_ fykm') var currOption = $ (currFylx ). parent (). next (). children () [0] currOption. length = 0 for (var I = 0; I <fylxArray. length; I ++) {// obtain the position of the current billing type in the billing subject array if (fylxArray [I] [0] = currFylx_value) {// obtain the billing subject var tmpfykmArray = fylxArray [I] [1] for the current billing type. split ("|") for (var j = 0; j <tmpfykmArray. length; j ++) {// fill in the charge subject drop-down menu currOption. options [currOption. length] = new Option (tmpfykmArray [j], tmpfykmArray [j]) ;}}</script>

Page code

<Td class = "ff"> <select style = "width: 100px" name = "select_name" onChange = "getChild (this) "> <option value =" "> -- none -- </option> <option value =" Vehicle Fee "> vehicle fee </option> <option value =" house rental fee "> house rental fee </option> <option value = "travel expenses"> travel expenses </option> <option value = "entertainment expenses"> entertainment expenses </option> <option value = "office expenses "> Office fee </option> <option value =" transportation fee "> transportation fee </option> <option value =" transportation fee "> transportation fee </option> <option value =" rental fee"> fare rental </option> <option value = "Labor Service Fee "> labor fee </option> <option value =" communication fee "> communication fee </option> <option value =" Water Fee "> water fee </option> <option value =" electricity Fee "> electricity fee </option> <option value =" conference fee "> conference fee </option> <option value =" Intermediary Service Fee "> intermediary service fee </option> <option value = "Express Delivery fee"> express delivery fee </option> <option value = "recruitment fee"> recruitment fee </option> <option value = "overtime meal fee"> overtime meal fee </option> <option value = "bidding fee"> bidding fee </option> <option value = "Print binding fee"> printing binding fee </option> <option value = "advertising fee"> advertising fee </option> <option value = "service charge for winning bids "> Winning service fee </option> <option value =" expert consulting fee "> expert consulting fee </option> <option value =" training fee "> training fee </option> <option value = "printing fee"> printing fee </option> <option value = "Employee Welfare fee"> Employee Welfare fee </option> <option value = "heating fee"> heating fee </option> <option value = "gas fee"> gas fee </option> <option value = "Production inspection fee"> Production inspection fee </option> <option value = "maternity hospitalization fee"> Maternity hospitalization fee </option> <option value = "maternity allowance"> Maternity Allowance </option> <option value = "Medical Insurance"> Medical Insurance </option> <option value = "other"> others </option> </select> </td> <! -- Charge type --> <td class = "ff"> <select style = "width: 100px "> <option> -- none -- </option> </select> </td> <! -- Charge account -->

The above example of implementing the Select second-level association in HTML in js is all the content shared by xiaobian. I hope to give you a reference and support for the customer's house.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.