Question

我的jquery脚本有问题，当我尝试从表单中发送日期值时返回错误，当我将其留空时，它不会显示错误。

<div class="field-wrap">
    <input type="date" name="fecha_nacimiento" required autocomplete="off" maxlength="30" placeholder="Fecha de nacimiento">Fecha de nacimiento</input>
</div> 
<script>
$(function(){
    $('#entrarBt').click(function(){
        $.ajax({
            url: 'registro_dpb.php',
            type: 'POST', // GET or POST               
            data: $("#miForm").serialize(), // will be in $_POST on PHP side

            success: function(data) { // data is the response from your php script
                // This function is called if your AJAX query was successful
                alert("Response is: " + data);
            },
            error: function() {
                // This callback is called if your AJAX query has failed
                alert("Error!");
            }
        });
    });
});
</script>

Answer 1

你的问题非常微妙......难以找到。
但解决方案非常简单。

您在<button>内使用<form>这绝对正确。

但您必须知道，在HTML5中，如果<button>的类型未明确定义为“按钮”，则其默认类型为“提交”。

参考here。

这是问题......
由于您希望使用允许在不重新加载页面的情况下接收响应的ajax请求进行提交，因此您必须“阻止”<button>的这种正常行为。

按钮提交的内容未发送到您的PHP脚本，而是发送到您的HTML页面（action标记中没有定义其他<form>，因此默认为“self”。
所以页面重新加载......让你的ajax请求失败。

所以有两种方法可以解决这个问题：

1 ：将按钮type定义为“按钮”：

<button type="button" id="entrarBt" [+ other attributes]>Entrar</button>

或
2 ：在点击处理程序中使用prevent.default()防止此默认行为。

$('#entrarBt').click(function(e){
  e.preventDefault();

  $.ajax({
      //...

我认为第二个对于可以查看代码的程序员来说更明显，但第一个也可以。

<小时/> 为了其他SO读者的利益：
我们（我和Javier）检查了几乎所有其他错误可能性in chat 我终于找到了原因，为了测试，我评论了整个ajax块然后注意到该页面仍在提交。

解决这个问题完全解决了这个问题。

绝对知道这是一个棘手的事情！ 简而言之，HTML5 <button>中的<form>默认为提交！

Ajax发送日期数据

1 个答案: