Question

我的表单上有一个带有jQuery操作的提交按钮，可以根据用户的选择打开一个窗口。但是，我只想在填充字段的情况下打开窗口。我有这段代码，我想将其与if合并。

$(function() {
  $('#chkveg').multiselect({
    includeSelectAllOption: true
  });

  $('#btnget').click(function() {
    window.open($('#chkveg').val());
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="http://formmail.kinghost.net/formmail.cgi" method="POST">
  <input name="nome" type="text" class="nome" id="nome" required width="100%" placeholder="Nome:">
  <input name="cpf" type="text" class="cpf" id="cpf" placeholder="CPF:">
  <div style="clear:both"></div><br/>
  <input name="nascimento" type="text" class="nascimento" id="nascimento" placeholder="Data de nascimento:">
  <select id="chkveg">
    <option value="https://pag.ae/7ULKPL7TH">Associados Ancord + C.Dados = R$700,00</option>
    <option value="https://pag.ae/7ULKQ8Zm2">Associados Ancord = R$800,00</option>
    <option value="https://pag.ae/7ULKQLB9m">Associados Entidades Apoiadoras + C.Dados = R$800,00</option>
  </select>
  <input id="btnget" class="submit-btn" type="submit" value="INSCREVER-SE">
</form>

例如：

IF (#FORM).REQUIRED = TRUE {
  (#BUTTON).WINDOWOPEN
}

谢谢

Answer 1

由于您使用了提交按钮，因此您需要return false，以防万一您不想做任何事情。在此之前，您还需要检查必填字段是否为空。（即$(your field).val() === ""为空，如果需要的话，请调用window.open()函数。注意：您可以合并多个字段进行检查，例如：$(".your_field1, .your_field2, .your_field3").val() === ""，但这是一个OR操作。

一种可能的解决方案：

$(function() {
  $('#btnget').click(function() {
    let isEmpty = false;
    $('#data_form input,textarea,select').filter(':visible').each(function(i) {
      if ($(this).val() === "") {
        isEmpty = true;
        return false;
      }
    });
    
    if (isEmpty) {
      return false;
    }
    
    window.open($('#chkveg').val());
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="data_form" action="http://formmail.kinghost.net/formmail.cgi" method="POST">
  <input name="nome" type="text" class="nome" id="nome" required width="100%" placeholder="Nome:">
  <input name="cpf" type="text" class="cpf" id="cpf" placeholder="CPF:">
  <div style="clear:both"></div><br/>
  <input name="nascimento" type="text" class="nascimento" id="nascimento" placeholder="Data de nascimento:">
  <select id="chkveg">
    <option value="https://pag.ae/7ULKPL7TH">Associados Ancord + C.Dados = R$700,00</option>
    <option value="https://pag.ae/7ULKQ8Zm2">Associados Ancord = R$800,00</option>
    <option value="https://pag.ae/7ULKQLB9m">Associados Entidades Apoiadoras + C.Dados = R$800,00</option>
  </select>
  <input id="btnget" class="submit-btn" type="submit" value="INSCREVER-SE">
</form>

如果只需要必填字段，则使用filter('[required]:visible')代替filter(':visible')。

如果表单字段未填写，如何不打开窗口？

1 个答案: