白日梦想jun
2016-10-16 05:00
采纳率: 58.7%
浏览 5.5k
已采纳

form中 onsubmit为什么不能阻止表单提交

 <form id="register" method="get" action="doRegister.jsp" onsubmit="return submitForm();">
<input type="submit" name="submit" value="注册"></input>
</form>

js中
function submitForm(){
            alert("111");
            if (userName && userNickname && isPswTrue && email && introduction) {   
                return true;
             }else{
                 alert("false");
                 return false;
             }
        }

当我测试的时候 表单里什么也没有写 然后点击submit按钮,没有弹出任何东西,而且浏览器地址栏中是这样的
doRegister.jsp?userName=&userNickname=&userPsw=&userfigPsw=&email=&introduction=&submit=注册

也就是它还是提交了,为什么 submitForm()函数没有执行啊?非常急,谢谢指导

也就是下面这个例子:
jq正确引入,但是表单提交的时候,没有执行 submitForm();就直接提交了。我用的ff测试的

<script type="text/javascript">
    $(function(){
        var name = '';
        $("input[name='userName']").blur(function(){
            if($(this).val()){
                name = $(this).val();
            }
        });
        function submitForm(){
            if(name){
                return true;
            }else{
                return false;
            }
        }

    })
</script>

html中:
<form id="register" method="get" action="https://www.baidu.com" onsubmit="return submitForm();">
                        <input type="text" name="userName" placeholder="用户名" autocomplete="off"/>
                        <input type="submit" name="submit" value="注册"/>
        </form>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

7条回答 默认 最新

  • 白日梦想jun 2016-11-01 14:28
    已采纳
    点赞 打赏 评论
  • blownewbee 2016-10-16 05:03
    点赞 打赏 评论
  • 当作看不见 2016-10-16 05:08

    阻止表单提交,你写个js 检测,不合法数据就禁用按钮,旁边给出提示错误信息

    点赞 打赏 评论
  • 说明你那个js文件没有正确导入,路径错了,下面内嵌的js运行可以弹出111

    还有注意userName这些变量要定义,代码不全,自己检查其他错误

     <form id="register" method="get" action="doRegister.jsp" onsubmit="return submitForm();">
        <input type="submit" name="submit" value="注册"></input>
    </form>
    <script>
    
        function submitForm() {
            alert("111");
            if (userName && userNickname && isPswTrue && email && introduction) {
                return true;
            } else {
                alert("false");
                return false;
            }
        }
    </script>
    
    
    点赞 打赏 评论
  • qq_35277383 2016-10-16 06:57

    函数上面没有写,触发多的是哪个标签。写上#register

    点赞 打赏 评论
  • 飞火流星02027 2016-10-16 13:30

    onsubmit事情本身就不能阻止表单的提交,不管这个事件是定义在form上还是type=submit的元素上。
    因为type=submit的元素本身是不会被任何事情阴止的。

    解决方案:把type为submit的标签改为普通的button。提交操作在js中去实现。

    代码:
    ##script type="text/javascript">
    function submitForm() {
    var form1 = document.getElementById("register");
    var name = form1.userName.value;
    if (name) {
    console.log("true ");
    form1.submit();
    } else {
    console.log("false ");
    return;
    }
    }
    ##/script>

    ##form id="register" method="get" action="https://www.baidu.com">
    ##input type="text" name="userName" placeholder="用户名"
    autocomplete="off" />
    ##input type="button" name="mysubmit" value="注册"
    onclick="submitForm();" />
    ##/form>

    点赞 打赏 评论
  • 飞火流星02027 2016-11-09 02:59

    会跳到action里面的对应的页面去的,如果没有,一定是代码出错了,只是没有像Java那样把exception报出来,你可以在IDE中加断点调试。同时还可以在js上加try{}catch(e){}语句捕捉异常

    点赞 打赏 评论

相关推荐 更多相似问题