黑马程序员技术交流社区

标题: innerHTML的内容为什么一闪而过。。 [打印本页]
作者: 葬天    时间: 2012-10-17 20:46
标题: innerHTML的内容为什么一闪而过。。
本帖最后由 葬天 于 2012-10-17 23:25 编辑

代码如下 ：
求解
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>form.html</title>
        
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
        <script type="text/javascript">
        function checkAll()
        {
                alert("hello");
                var info = document.getElementById("info");
                info.innerHTML = "一闪而过呢";
        }
        </script>
  </head>

  <body>
    <form>
    用户名：
    <input type="text" name="userName"/><br/>
    <input type="submit" value="submit"/>
    <div id="info"></div>
    </form>
  </body>
</html>


//运行后总是想要显示的内容总一闪而过。。。


作者: qhasilver    时间: 2012-10-17 21:36
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.     <title>form.html</title>
  5.         
  6.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  7.     <meta http-equiv="description" content="this is my page">
  8.     <meta http-equiv="content-type" content="text/html; charset=GBK2312">

  10.     <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  11.         <script type="text/javascript">
  12.         function checkAll()
  13.         {
  14.                 alert("hello");
  15.                 var info = document.getElementById("info");
  16.                 info.innerHTML = "一闪而过呢";
  17.         }
  18.         </script>
  19.   </head>

  21.   <body onload="javascript:checkAll()">
  22.     <form>
  23.     用户名：
  24.     <input type="text" name="userName"/><br/>
  25.     <input type="submit" value="submit"/>
  26.     <div id="info"></div>
  27.     </form>
  28.   </body>
  29. </html>
复制代码
你的javascript没有执行,你能看到一闪而过？我在body上设置了 <body onload="javascript:checkAll()">
作者: 梁世喜    时间: 2012-10-17 21:42
本帖最后由 梁世喜 于 2012-10-17 21:45 编辑

  2. <P><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  3. <html>
  4.   <head>
  5.     <title>form.html</title>
  6.         
  7.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  8.     <meta http-equiv="description" content="this is my page">
  9.     <meta http-equiv="content-type" content="text/html; charset=UTF-8"></P>
  10. <P>    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  11.         <script type="text/javascript">
  12.         function checkAll()
  13.         {
  14.                 alert("hello");
  15.                 var info = document.getElementById("info");
  16.                 info.innerHTML ="一闪而过呢";
  17.   return false;
  18.         }
  19.         </script>
  20.   </head></P>
  21. <P>  <body>
  22.     <form onsubmit="javascript:checkAll()">
  23.     用户名：
  24.     <input type="text" name="userName"/>

  26.     <input type="button" value="普通按钮" onclick="javascript:checkAll()"/>
  27.     <input type="submit" value="submit" /></P>
  28. <P>    </form>
  29.     <div id="info"></div>
  30.   </body>
  31. </html></P>
  32. <P>
  33. </P>
复制代码
你的表单验证放在了  Submit  事件上，验证之后会跳到一个新的页面。
虽然你这里没写跳到那个页面。其实已经重新加载了网页，所以你会认为是一闪已过。
作者: 葬天    时间: 2012-10-17 22:05
梁世喜 发表于 2012-10-17 21:42
你的表单验证放在了  Submit  事件上，验证之后会跳到一个新的页面。
虽然你这里没写跳到那个页面。其实已 ...

能具体讲讲 两个按钮的区别吗？
普通按钮的效果确实达到了我想要的结果
作者: qhasilver    时间: 2012-10-17 22:45
我又看错题了- -#，
submit事件属于系统定义的一种提交表单的方法，提交之后会强制刷新页面，除非得到中断指令，页面中的数据随着刷新丢失了，普通按钮，可以自定义被点击后的触发事件,。
作者: 汤瑞贺    时间: 2012-10-17 23:05
submit按钮作用就提交表单，发送数据给服务器，button按钮就本地用用，
作者: 葬天    时间: 2012-10-17 23:23
明白了 谢谢各位了



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2