Javascript 如果“发件人”字段无效，如何隐藏引导模式窗口

我正在尝试使用jquery发送表单数据和获取响应，并将其显示在模式窗口中。每个表单字段都是必需的，因此我使用attb required。单击submit，数据应提交到jquery并获取响应。但如果任何字段为空，则应显示错误。现在的问题是它也切换模式窗口。请看下面我的代码

<form name="newjoin" method="post" enctype="multipart/form-data" id="JoiningConform">

<label for="sponsorid">Name: <span class="req">*</span></label>
<input type="text" id="name" name="name" placeholder="Your Name" class="form-control" tabindex="1" required />

<button type="submit" data-toggle="modal" href="#myModal" class="button btn btn-primary btn-large">Register</button>


<div id="myModal" class="modal fade in">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                    <a class="btn btn-default pull-right" data-dismiss="modal"><span class="fa fa-remove"></span></a>
                    <h4 class="modal-title">CONGRALUATIONS</h4>
                </div>
                <div class="modal-body">
                    <h4>Text in a modal</h4>
                    <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
                    <div id="modal-div"></div>
                </div>

            </div><!-- /.modal-content -->
        </div><!-- /.modal-dalog -->
    </div><!-- /.modal --> 

我关心的是，如果我点击按钮，如果任何字段是空的，它应该在成功响应后只显示错误，只显示模式窗口

示例图像

试试这个。。。 首先验证name字段

$('form#JoiningConform').on('submit',function(event){
  event.preventDefault()
  var name = $('#name').val();
  if(name == ""){
    alert('error message');
    return false;
  }else{
    $.ajax({
        type:'post',
        url:'testmodal.php',
        data:$('form#JoiningConform').serialize(),
        success: function(response){
            $('#myModal').modal('show');
            $('#modal-div').html(response);
        }
    });
  }
});

---

在发送数据之前验证数据是否更有意义？我在表单验证中使用了必需的attb。这就是问题所在-您应该考虑解决它。您选中了

if（！response）{

但是您没有提供

响应

变量的内容…首先验证字段，然后提交表单。我们可以使用required=required HTML5在表单中进行验证吗？您在表单提交上使用的是ajax请求，因此当您点击提交按钮时，ajax请求将被执行，即使您的字段为空……在这种情况下，您可以在提交表单之前，使用jquery的.each（）函数验证所有字段。我尝试编写代码，但仍然存在相同的问题。请参阅问题i添加图像OK，我查看了您的代码。从提交按钮中删除（data toggle=“modal”href=“#myModal”）。

$('form#JoiningConform').on('submit',function(event){
  event.preventDefault()
  var name = $('#name').val();
  if(name == ""){
    alert('error message');
    return false;
  }else{
    $.ajax({
        type:'post',
        url:'testmodal.php',
        data:$('form#JoiningConform').serialize(),
        success: function(response){
            $('#myModal').modal('show');
            $('#modal-div').html(response);
        }
    });
  }
});