Chinaunix

标题: 写form提交应该注意的 [打印本页]
作者: 听老歌    时间: 2011-09-15 09:52
标题: 写form提交应该注意的
写form提交应该注意的



前两天改bug，发现一个表单提交提交的问题，先上代码：


Html代码

  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>Test</title>
  7. <script type="text/javascript" src="http://www.z7zba.com/js/jquery-1.4.4.min.js"></script>
  8. </head>
  9. <style type="text/css">

  11. </style>
  12. <body>
  13. <?
  14. print_r($_POST); echo "\r\n";
  15. ?>


  18. <table border="0" cellpadding="0" cellspacing="0">
  19.         <form id="theFrom" name="theForm" action="demo.php" method="post">
  20.         <tr>
  21.             <td id="tdName"><input type="text" id="name" name="name" /></td>
  22.     </tr>
  23.         <tr>
  24.             <td><a href="javascript:searchName();">查找姓名</a>&nbsp;<a href="javascript:doSubmit();">提交</a></td>
  25.     </tr>
  26.     </form>
  27. </table>

  29. <script type="text/javascript">

  31. function searchName()
  32. {
  33.         //可以是ajax返回内容
  34.         var data = '<select id="nameId" name="nameId"><option value="1">Cheech</option><option value="2">Mark</option></select>';
  35.         $("#tdName").html(data);
  36. }
  37. function doSubmit()
  38. {
  39.         $("#theFrom").submit();
  40. }
  41. </script>
  42. </body>
  43. </html>
复制代码
当其中的 <input type="text" id="name" name="name" /> 被换成 <select id="nameId" name="nameId"><option value="1">Cheech</option><option value="2">Mark</option></select> 进行提交。

$_POST['nameId']在使用 ie 浏览器提交，程序可正常接收到参数 ，而使用Chrome,FireFox提交，程序不能提收到参数

问题出在form的位置套错了。将form套在table外问题就解决了。如下：（其他不变）


Html代码

  2. <form id="theFrom" name="theForm" action="demo.php" method="post">
  3. <table border="0" cellpadding="0" cellspacing="0">
  4.         <tr>
  5.             <td id="tdName"><input type="text" id="name" name="name" /></td>
  6.     </tr>
  7.         <tr>
  8.             <td><a href="javascript:searchName();">查找姓名</a>&nbsp;<a href="javascript:doSubmit();">提交</a></td>
  9.     </tr>
  10. </table>
  11. </form>
复制代码




欢迎光临 Chinaunix (http://bbs.chinaunix.net/) Powered by Discuz! X3.2