Question

我的jQuery验证表单会在用户点击"Next"按钮时尝试发送空数据时向用户发出警告。

无论如何，用户仍然可以通过按 Enter 发送空数据。

所以我使用下面的代码，按下 Enter 同点击"Next"按钮;

// this script makes pressing Enter gives error. But empty data still goes to database.
   $('.form-horizontal').keypress(function (event) {
        if (event.which === 13) {
        $(".next").trigger('click');
        }
        });

此代码仅阻止用户进入下一步。但是当用户点击正在写入数据库的 Enter 数据时，即使他看到＆＃34;错误消息＆＃34;。

*

好吧，服务器端验证可以轻松防止这种情况。但是，如果我们可以提前阻止，为什么必须让服务器忙于那个？

这是 JsFiddle 你可以测试整个事情：

http://jsfiddle.net/6zu2vsj7/3/

*

有没有办法让它在没有让服务器忙于空字段的情况下工作？而且我不想阻止用户按 Enter ，因为这根本不是很酷，也不利于用户体验。

Answer 1

您可以在将数据发送到服务器之前添加条件以检查表单是否有效，如下所示。希望这会有所帮助...

// Let's act like we send to database.
            $(function(){
                $('input[type=submit]').click(function(){
                    if($("#myform").valid()){

                    $.ajax({
                        type: "POST",
                        url: "sent.php",
                        data: $("#myform").serialize(),
                        beforeSend: function(){
                            $('#stepsuccess').html('Sent to the database. Strange.');               
                        },
                        success: function(data){
                            $('#stepsuccess').html(data);

                        }
                    });
                    }
                });
            });

Answer 2

您只需要阻止该事件的默认行为

你可以用这个

 $('.form-horizontal').keypress(function (event) {
            if (event.which === 13) {
                event.preventDefault();
                $(".next").trigger('click');
            }
        });

Answer 3

试试这个：

$(".form-horizontal").submit(function(e){
//do somethings or other validations
return false;
});

以及！服务器端验证是必要的，因为客户端验证仅适用于普通用户！不是黑客和机器人！得到它了？！事实上，客户端验证很容易通过。

阻止用户发送空字段

3 个答案: