zoukankan      html  css  js  c++  java
  • FORM表单 onclick()与onsubmit()

    FORM表单中onclick()、submit()与onsubmit()的问题

    最近遇到一次处理form数据的过滤,采用了button的onclick事件来检查,发现return false后表单仍然提交了。

    于是仔细研究了下onclick、onsubmit、submit集合函数之间的关系和区别

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    onsubmit:
    You can override this event by returning false in the event handler.
    Use this capability to validate data on the client side to prevent invalid data from being submitted to the server.
    If the event handler is called by the onsubmit attribute of the form object,
    the code must explicitly request the return value using the return function,
    and the event handler must provide an explicit return value for each possible code path in the event handler function.
    The submit method does not invoke the onsubmit event handler.
     
    submit:
    The submit method does not invoke the onsubmit event handler.
    Call the onsubmit event handler directly.
    When using Microsoft? Internet Explorer 5.5 and later,
    you can call the fireEvent method with a value of onsubmit in the sEvent parameter.

    首先生成一个form

    1
    2
    3
    4
    <form action="#" method="POST" name="A" onsubmit="return X();">
    <input type="text" value="" />
    <input onclick="Y()" type="submit" value="提交" />
    </form>

    自己写X()、Y()函数,我们会发现,这几个函数的执行顺序

    1) onclick: Y();

    2) onsubmit: X();

    3) submit();

    也就是说

    只要 onclick 未 return false 那么就继续执行 onsubmit

    只要 onsubmit 未return false 那么表单就被提交出去了

    另外一点写法上注意一定要 “return X();” 才能取得函数的返回值,否则只是调用函数,返回值未被传递

    正确写法:
    <input type=submit onclick=”return X();”>
    //X() 返回false后,form的submit会被终止

    错误写法:
    <input type=submit onclick=”X()”>

    //X() 返回false后未传递给onclick事件,form的submit会继续

  • 相关阅读:
    winrt组件库(包括翻书组件)
    WebRequest 获取网页乱码
    OpenNI结合Unity3D Kinect进行体感游戏开发(转)
    python(pyqt)开发环境搭建
    win8开发wpf程序遇到的无语问题
    winrt 页面进入动画
    winrt 根据类型生成实例
    性能测试基础
    性能基础入门篇
    项目部署
  • 原文地址:https://www.cnblogs.com/weiweithe/p/4305193.html
Copyright © 2011-2022 走看看