html 提交表单问题，求高手指点。。

初学html，这个问题我有可能描述不清，我想把第二个html点击ok后能像，第一个html那样点击ok后显示出有选择的表单值。望高手指点。1.<html>
<head>
<title>提交表单测试</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<style>
!--
.b{
position:absolute;
left:0;
top:0;
width:200px;
height:100px;
color:#fff;
background:#000;
}
-->
</style>
</head>
<body><div id="d2">
<form name="myform" action="#">
  
    <select name="name">
      <option value="eth1">eth 1</option>
      <option value="eth2">eth 2</option>
      <option value="eth3">eth 3</option>
      <option value="eth4">eth 4</option>
    </select>
    <select name="name1">
      <option value="loop">loop</option>
      <option value="noloop">noloop</option>
    </select>
    <input type="button" id="but" value="ok";>
  </div>
</form>
<div id="d1" class="b" style="display:none;">asdf</div></body>
<script>
function select_function(){
var name=document.myform.name.value;
var name1=document.myform.name1.value;
document.getElementById("d1").style.display="";
document.getElementById("d2").style.display="none";
document.getElementById("d1").innerHTML=""+name+""+name1;
}
document.getElementById("but").onclick = select_function;
</script>
</html>
2.<html>
<head>
<title> </title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<style>
!--
.b{
position:absolute;
left:0;
top:0;
width:200px;
height:100px;
color:#fff;
background:#000;
}
-->
</style>
</head>
<body><div id="d2">
<form name="myform" action="#">
<table width="539" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <th width="47" scope="col">&nbsp;</th>
    <th width="164" scope="col">
      <select name="name">
      <option value="eth1">eth 1</option>
      <option value="eth2">eth 2</option>
      <option value="eth3">eth 3</option>
      <option value="eth4">eth 4</option>
    </select></th>
    <th width="132" scope="col">
      <select name="name1">
      <option value="loop">loop</option>
      <option value="noloop">noloop</option>
    </select></th>
    <th width="80" scope="col">&nbsp;</th>
    <th width="104" scope="col">
    <input type="button" id="but" value="ok";></th>
   </div>
 
 </tr>
</table>
</form><div id="d1" class="b" style="display:none;">asdf</div></body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function select_function(){
var name=document.myform.name.value;
var name1=document.myform.name1.value;
document.getElementById("d1").style.display="";
document.getElementById("d2").style.display="none";
document.getElementById("d1").innerHTML=""+name+""+name1;
}
document.getElementById("but").onclick=select_function;
</script>
</html>

解决方案 »

  1.   

    <div id="d2">
    <form name="myform" action="#">
    <table width="539" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <th width="47" scope="col">&nbsp;</th>
        <th width="164" scope="col">
          <select name="name">
          <option value="eth1">eth 1</option>
          <option value="eth2">eth 2</option>
          <option value="eth3">eth 3</option>
          <option value="eth4">eth 4</option>
        </select></th>
        <th width="132" scope="col">
          <select name="name1">
          <option value="loop">loop</option>
          <option value="noloop">noloop</option>
        </select></th>
        <th width="80" scope="col">&nbsp;</th>
        <th width="104" scope="col">
        <input type="button" id="but" value="ok";></th>
       </div>
     
     </tr>
    </table>
    </form></div><!----这里少了个div，导致d1被包含在d2中了，你有隐藏了d2就没显示了-------><div id="d1" class="b" style="display:none;">asdf</div>