为了账号安全,请及时绑定邮箱和手机立即绑定

js显示问题,小白求救

js显示问题,小白求救

Rey4 2017-11-29 21:04:14
我想问的是如何能让下面的表格一开始隐藏,点击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标签越多页面加载的会越慢,建议先整体有了概念,再实际操作,或者边看基础知识边写代码,不要脱离了基础。加油

查看完整回答
反对 回复 2017-11-29
  • 1 回答
  • 0 关注
  • 901 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信