JQuery Ajax 完成所需的文本区域

Question

各位。我有一个（一组）表单，里面有一个文本区域。此文本区域有属性 required。它按预期工作。如果用户尝试在未填写文本区域的情况下提交表单，浏览器会突出显示它并通知用户。

我的问题是我拦截了使用 JQuery AJAX 提交的表单，因此我可以在不重新加载页面的情况下通知用户。代码如下：

$(function () {
$('form').each(function (id, el) {
    $(el).submit(function (event) {
        event.preventDefault();
        var _data = $(el).serialize();
        alert(_data);
        $.ajax({
                type: 'POST',
                url: $(el).attr('action'),
                data: _data
        })
        .done(function(response) {
            $("#notify-modal").find('.modal-body').removeClass('alert-danger');
            $("#notify-modal").find('.modal-body').addClass('alert-success');
            $("#notify-modal").find('.modal-body').text('Já recebemos sua história! Obrigado por compartilhá-la conosco!');
            $("#notify-modal").modal('show');
            $(el).find('textarea').val('');
        })
        .fail(function(data) {
            $("#notify-modal").find('.modal-body').removeClass('alert-success');
            $("#notify-modal").find('.modal-body').addClass('alert-danger');
            $("#notify-modal").find('.modal-body').text("Erro ao enviar história! Contate os administradores do site! " + data.responseText);
            $("#notify-modal").modal('show');
        });
    });
});

});

当用户提交有效信息时，AJAX 函数会按预期工作，将其发布到我的 PHP 脚本并显示通知用户的模态。但请注意，在 .done() 函数中有一条语句在数据提交后清除文本区域 ($(el).find('textarea').val('');)。我的问题是，当我清除文本区域时，即使数据已正确提交，它也会突出显示，就好像在提交之前已被清除一样。我怎样才能防止这种行为？

Answer 1

这是因为它是必需的，无论用户是否提交了任何东西。查看 this answer 以了解如何继续。另一种选择是将文本区域的值设置为 space ' ' 而不是什么都没有 ''.

Image of error provided by Mateus Felipe

第二个表单没有交互，这就是它没有显示错误的原因。仅当存在值时才会将其标记为错误，然后将其删除。如果一个值从未存在，那么它只会在用户尝试通过表单提交按钮或未阻止默认事件的输入提交表单时进行标记。

JQuery Ajax 完成所需的文本区域

JQuery Ajax Done with required textarea

jquery

ajax

html

textarea

required