JS implementation: Click-to-Edit function code

Source: Internet
Author: User

Effect:

Share the Code:
<Html> <pead> <title> </pead> <body leftMargin = "0" topMargin = "1" marginwidth = "0" marginheight = "0" style = "overflow: auto "> <table width =" 100% "cellSpacing =" 0 "cellPadding =" 0 "border =" 0 "> <tr height =" 30px "> <td> </td> </tr> <tr valign = "top" height = "300px; "> <td width =" 50% "align =" right "> <table cellSpacing =" 0 "cellPadding =" 0 "width =" 88% "align =" center "> <tr> <td width = "30%" align = "center" valig N = "top"> <table id = "inputTab_1" cellSpacing = "0" cellPadding = "0" width = "100%" align = "center" style = "margin-top: 0px "> <tr> <td style =" padding-left: 5px; text-align: left; background-color: # EAEBDB; height: 25px; border-bottom: solid 1px #000 "> Configure budget items </td> </tr> <td id =" inputTd_1_1 "height =" 22px; "onclick =" switchShow (true, 1, 1); "style =" border-bottom: solid 1px #000; "> educational tuition <input id =" inputTex T_1_1 "onblur =" switchShow (false, 1, 1); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" educational tuition "> a university degree has become the basic threshold for social work and the basic for parents to provide their children. Children's Education has no time elasticity and cost elasticity, unlike housing planning and retirement planning, if there are insufficient gifts, the standards can be reduced. The time and cost of children's education are relatively fixed and early planning is required. </Td> </tr> <td id = "inputTd_1_2" height = "22px;" onclick = "switchShow (true, 2, 1 ); "style =" border-bottom: solid 1px #000; "> accommodation fee <input id =" inputText_1_2 "onblur =" switchShow (false, 2, 1 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" accommodation fee "> accommodation fee description. </Td> </tr> <td id = "inputTd_1_3" height = "22px;" onclick = "switchShow (true, 3, 1 ); "style =" border-bottom: solid 1px #000; "> living expenses <input id =" inputText_1_3 "onblur =" switchShow (false, 3, 1 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" living expenses "> living expenses project description. </Td> </tr> <td id = "inputTd_1_4" height = "22px;" onclick = "switchShow (true, 4, 1 ); "style =" border-bottom: solid 1px #000; "> Other <input id =" inputText_1_4 "onblur =" switchShow (false, 4, 1 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" other "> other project description. </Td> </tr> <td id = "inputtd_00005" height = "22px;" onclick = "switchShow (true, 5, 1 ); "style =" border-bottom: solid 1px #000; "> <input id =" inputtext_00005 "onblur =" switchShow (false, 5, 1 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" "></td> </tr> </table> <table id =" inputTab_2 "cellSpacing =" 0 "cellPadding =" 0 "width =" 100% "align =" center "style =" margin-top: 0px "> <tr> <td s Tyle = "padding-left: 5px; text-align: left; background-color: # EAEBDB; height: 25px; border-bottom: solid 1px #000 "> Configure applicable regions </td> </tr> <td id =" inputTd_2_1 "height =" 22px; "onclick =" switchShow (true, 1, 2); "style =" border-bottom: solid 1px #000; "> northwest China <input id =" inputText_2_1 "onblur =" switchShow (false, 1, 2); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" northwest China "> Configure the applicable region, West China North Region, project description. </Td> </tr> <td id = "inputTd_2_2" height = "22px;" onclick = "switchShow (true, 2, 2 ); "style =" border-bottom: solid 1px #000; "> Fujian <input id =" inputText_2_2 "onblur =" switchShow (false, 2, 2 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" Fujian Province "> applicable regions, Fujian Province, project description. </Td> </tr> <td id = "inputTd_2_3" height = "22px;" onclick = "switchShow (true, 3, 2 ); "style =" border-bottom: solid 1px #000; "> Beijing <input id =" inputText_2_3 "onblur =" switchShow (false, 3, 2 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" Beijing "> Configuration regions, Beijing, project description. </Td> </tr> <td id = "inputTd_2_4" height = "22px;" onclick = "switchShow (true, 4, 2 ); "style =" border-bottom: solid 1px #000; "> <input id =" inputText_2_4 "onblur =" switchShow (false, 4, 2 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" "> </td> </tr> <td id =" inputTd_2_5 "height =" 22px; "onclick =" switchShow (true, 5, 2); "style =" border-bottom: solid 1px #000; "> <input id =" I NputText_2_5 "onblur =" switchShow (false, 5, 2); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" "> </td> </tr> </table> <table id =" inputTab_3 "cellSpacing =" 0 "cellPadding =" 0 "width =" 100% "align =" center "style =" margin-top: 0px "> <tr> <td style =" padding-left: 5px; text-align: left; background-color: # EAEBDB; height: 25px; border-bottom: solid 1px #000 "> Configuration Budget Scheme </td> </tr> <tr> <Td id = "inputTd_3_1" height = "22px;" onclick = "switchShow (true, 1, 3);" style = "border-bottom: solid 1px #000; "> low-cost budget solution <input id =" inputText_3_1 "onblur =" switchShow (false, 1, 3); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" low-cost budget Scheme "> Configure the Budget Scheme, low-cost budget scheme, and project description. </Td> </tr> <td id = "inputTd_3_2" height = "22px;" onclick = "switchShow (true, 2, 3 ); "style =" border-bottom: solid 1px #000; "> General Budget Scheme <input id =" inputText_3_2 "onblur =" switchShow (false, 2, 3 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" Normal Budget Scheme "> Configure the Budget Scheme and General Budget Scheme, project description. </Td> </tr> <td id = "inputTd_3_3" height = "22px;" onclick = "switchShow (true, 3, 3 ); "style =" border-bottom: solid 1px #000; "> luxury budget solution <input id =" inputText_3_3 "onblur =" switchShow (false, 3, 3 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" luxury Budget Scheme "> Configure the Budget Scheme and luxury Budget Scheme, project description. </Td> </tr> <td id = "inputTd_3_4" height = "22px;" onclick = "switchShow (true, 4, 3 ); "style =" border-bottom: solid 1px #000; "> <input id =" inputText_3_4 "onblur =" switchShow (false, 4, 3 ); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" "> </td> </tr> <td id =" inputTd_3_5 "height =" 22px; "onclick =" switchShow (true, 5, 3); "style =" border-bottom: solid 1px #000; "> <input id =" I NputText_3_5 "onblur =" switchShow (false, 5, 3); "type =" text "class =" inputmess "style =" width: 100%; display: none "value =" "> </td> </tr> </table> </td> <td width =" 8% "align =" center "valign =" top" style = "padding-right: 5px "> <input type =" button "value =" delete "onClick =" deleteItem (); "/> </td> <td width =" 50% "align =" left "valign =" top "> <pre class =" code "id =" inputContent "onblur =" saveContent (); "style =" width: 90%; height: 410px "> a university degree has become the basic threshold for social work and the basic for parents to provide their children. Children's Education has no time elasticity and cost elasticity, unlike housing planning and retirement planning, if there are insufficient gifts, the standards can be reduced. The time and cost of children's education are relatively fixed and early planning is required. </Textarea> </td> </tr> </table> </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

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.