我想问的是如何能让下面的表格一开始隐藏,点击submit后显示出来。还有怎么能把上方输入的数据在表格里显示,而不是显示undefined。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>Managerment Panel</title><style type="text/css">.input{ position:relative; padding:0; margin:0;}.range{ margin-right:18%; font-weight:bolder}.range2{ margin-right:56%; font-weight:bolder;}.border{ border:2px #006699 solid; padding:0; margin:0 25%; border-radius:9px;}.result{ border:2px solid #CCCCCC; position:relative; margin:3% 6%; padding:3% 1%; border-radius:9px;}.form{ margin:0; padding:0 0;}.title{ margin:0; padding:2% 0; color:#FFFFFF; background-color:#006699;}.radius{ border-radius:9px;}#result{ display:none;}</style><script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"> var variable = document.getElementById("variable"); var variable_text= variable.value; var integer = document.getElementById("integer"); var integer_text= integer.value; var selects = document.getElementById("selects"); var select_text= selects.value; var chinese = document.getElementById("chinese"); var chinese_text= chinese.value; var email = document.getElementById("email"); var email_text= email.value; function showresult() { document.getElementById("result").style.display = "block"; } </script></head><body> <div class="border"> <h2 align="center" class="title">Form Validation</h2> <div class="input"> <form class="form" > <div class="range" align="right"> <p>Variable: <input id="variable" class="radius" style="width:60%;" type="text" name="variable" value="Enter a Variable"/> </p> <p>Integer: <input id="integer" class="radius" style="width:60%;" type="text" name="integer" value="Enter an Integer"/> </p> </div> <div class="range2"> <p align="right" > <label>select:</label> <select name="select" class="radius" id="selects"> <option value="Select" selected="selected">Select</option> <option value="Code 0">Code 0</option> <option value="Code 1">Code 1</option> <option value="Code 2">Code 2</option> <option value="Code 3">Code 3</option> <option value="Code 4">Code 4</option> <option value="Code 5">Code 5</option> </select> </p> </div> <div class="range" align="right"> <p>中文: <input id="chinese" class="radius" style="width:60%;" type="text" name="中文" value="中文输入"/> </p> <p>E-mail: <input id="e-mail" class="radius" style="width:60%;" type="text" name="E-mail" value="Enter a E-mail"/> </p> </div> <p align="center"> <input onclick="showresult()" class="radius" type="submit" value="Submit"> </p> </form> </div> <div class="result"> <table id="result" width="100%" cellpadding="15%" cellspacing="0"> <tr align="center"> <td width="235">Variable</td> <td width="242"><script type="text/javascript">document.write(variable_text);</script></td> </tr> <tr align="center"> <td width="235">Integer</td> <td width="242"><script type="text/javascript">document.write(integer_text);</script></td> </tr> <tr align="center"> <td width="235">Select</td> <td width="242"><script type="text/javascript">document.write(select_text);</script></td> </tr> <tr align="center"> <td width="235">Chinese</td> <td width="242"><script type="text/javascript">document.write(chinese_text);</script></td> </tr> <tr align="center"> <td width="235">E-mail</td> <td width="242"><script type="text/javascript">document.write(email_text);</script></td> </tr> </table> </div></div></body></html><!--要先把表格数值隐藏起来,不显示undefined,赋值后显示--><!--要解决的问题还有隐藏表格-->
1 回答
努力奋斗的小黄人
TA贡献5条经验 获得超1个赞
<td width="242"><script type="text/javascript">document.write(variable_text);</script></td>
这种写法很不友好的,我建议先看看基本的js再来练手会比较好,script标签越多页面加载的会越慢,建议先整体有了概念,再实际操作,或者边看基础知识边写代码,不要脱离了基础。加油
添加回答
举报
0/150
提交
取消