onsubmit事件无法触发

先上代码,用的zepto.js:

test1.php

<body>
<form action="test2.php" method="get" id="form1" name="form1" onsubmit="return formcheck();">
    <input type="text" name="text1" id="text1" />
    <input value="submitText" type="button" name="submit1" id="submit1" onclick="return document.form1.onsubmit();"/>
</form>
<script>
    function formcheck(){
        if($("#text1").val()==""||$("#text1").val()==null){
            alert("error");
            return false;
            }else{
                alert("success");
                return true;
            }
        }
</script>
</body>

今天被这个问题困扰了一下午了,用type="button"的按钮触发表单的onsubmit事件老是不成功。
分析一下流程吧,打开页面是这样的
clipboard.png
在第一个域输入数据,如果输入为空则formcheck函数返回false,页面不跳转,若在第一个域输入任意数据都会跳转到test2.php,这是正常的情况。问题就是输入数据点击提交的时候跳转不正确。比如我输入了数据点击提交,正常来说formcheck函数应该返回true,我应该跳转到test2.php的,可是我点了提交,alert语句的success提示弹出来了,偏偏页面就是不跳转。我尝试过把提交按钮的input属性改为submit,运行正常。或是把提交按钮的onclick事件改成onclick="$('#form1').submit()",也是运行正常,偏偏就是input="button"的情况出问题,我觉得是return语句没有正确返回。百度了很久,尝试过把提交按钮的onclick改成onclick="document.form1.submit();",也是不行,更糟糕的是连onsubmit事件都没有触发直接跳转过去了,连alert的信息都没有输出。烦了一下午,特来此求大神解答,这是什么原因以及怎么解决的

阅读 12.1k
2 个回答
<input value="submitText" type="button" name="submit1" id="submit1" onclick="return document.form1.submit();"/>

建议不要在html中嵌入js

根本原因是你只是调用了onsubmit事件的方法,但是没有触发submit事件。要通过代码提交表单应该用form.submit()。完整代码:

<input value="submitText" type="button" onclick="return document.form1.submit();"/>

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题