html,js,关于表单提交的问题

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <title>test04</title>
</head>
<body>
<form action="http://www.baidu.com">
    <label>输入1跳转到百度&nbsp&nbsp</label><input type="text" id="input">
    <input type="submit" value="提交" id="button">
</form>
</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $("#button").click(function(){
        var val = $("#input").val();
        if(val == 1){
            return true;
        }else{
            return false;
        }
    })
})
</script>
</html>

上面这个写法不是很理解,return的值被谁接收到了,是按钮中的属性还是表单中的什么属性,求哪位大大告诉我上面我点击按钮后浏览器具体的实现思路或者步骤,怎么提交的表单

阅读 4k
4 个回答

1)return true/false的目的在于阻住form表单的默认提交
2)type为submit的按钮的点击默认行为就是提交表单,如果回调函数不返回值或返回true,那就提交表单
否则默认行为不发生
3)和调用event.preventDefault方法同样的效果

<script type="text/javascript">
$(function(){
    $("#button").click(function(event){
        var val = $("#input").val();
        if(val!=1){
           event.preventDefault();
        }
    })
})
</script>

我也不太清楚,但是你可以改写成click(true)和click(false)试试

return的值是给submit的啦,如果真则提交,否则不提交

这个事件用错了。。。

$("#button").click(function(){
        var val = $("#input").val();
        if(val == 1){
            return true;
        }else{
            return false;
        }
    })

阻止/同意表单提交的事件是onsubmit而不是onclick,你的jq代码写法相当于原生的:

 window.onload=function(){
        document.getElementById('button').onclick=function(){
            var val=document.getElementById('input').value;
            val==1?return true:return false;
        }
  }

这样提交是错误的,正确的应该是:

window.onload=function(){
            document.getElementById('button').onsubmit=function(){
                var val=document.getElementById('input').value;
                val==1?return true:return false;
            }
      }

也就是jq的:

$(function(){
     $('#button').on('submit',function(){
          $('#input').val()==1?return true:return false;
     });
}) 

这样return的布尔值是代表是否提交,true为同意提交,false为阻止提交

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