zoukankan      html  css  js  c++  java
  • Form表单三种提交按钮的区别?

    1.<input type='button' id='btn' onclick='check()' value="提交">

      说明:只是普通的按钮(不附带提交功能),不会触发form表单的submit()事件,所以点击后不会提交表单

          好处:可加入js验证,验证后若想提交可使用 document.Formname.submit()  -->js 提交函数,进行提交  Formname 为表单的name名字

         若不加载提交,利用Ajax获取数据,可实现页面不刷新,文本框内容保留

    <form  action='test.php' method="post" name="Form">
    手机号<input type="text" name="phone">
    <input type='button' id='btn'  value="提交" onclick='check()'>
     </form>

    function check(){
    js判断
    document.Formname.submit(); 判断后提交 Formname 为form的name   document.getElementById("id").submit();也可获取,获取到form表单即可 id为form表单 id

    }

    2.<input type="submit" id='btn'  value="提交" onclick='return check()'>

      说明:提交按钮,点击后会触发form的onsubmit事件 提交数据实现页面跳转,进行表单处理

      若想使用js验证,可在form onsubmit事件里进行返回值判定,若返回false 表单不提交 若返回ture 表单提交

    <form  action='test.php' method="post" name="Form" onsubmit="return check()">   若不加return 函数返回值,则会始终提交
    手机号<input type="text" name="phone">
    <input type="submit" id='btn'  value="提交" >
    </form>

      也可在按钮里面加上判断函数

    <form  action='test.php' method="post" name="Form" >   若不加return 函数返回值,则会始终提交
    手机号<input type="text" name="phone">
    <input type="submit" id='btn'  value="提交" onclick="return check()" >
    </form>
    function check(){

    return confirm('Yes or no!');

    }

    3.<button></button>按钮 同 <input type="submit" id='btn'  value="提交" >按钮效果一样

  • 相关阅读:
    Windows开发,关于通过写代码加载PDB的那些事
    从FreeBSD里面看到的网络协议列表,感觉可以保存一下
    听了几段《双投唐》
    ReactOS 无法显示中文的问题
    ReactOS 代码更新后的编译安装
    都什么年代了,怎么还那种德行
    假冒不伪劣
    ollvm 使用——“Cannot open /dev/random”错误的解决方法
    ollvm 编译
    C/C++ 吐槽第一期:你最讨厌的C/C++里面的数据类型是什么
  • 原文地址:https://www.cnblogs.com/jiechn/p/4238182.html
Copyright © 2011-2022 走看看