在空输入字段上停止表单提交答案

【问题标题】：Stop form submission on empty input field在空输入字段上停止表单提交
【发布时间】：2016-07-21 08:55:56
【问题描述】：

我希望当我的表单输入字段为空时，它会向我显示警报并停止表单提交。现在我的代码的问题是它只显示警报但不停止表单提交。这是我的 html 输入字段和脚本：

function required() {
  var empt = document.forms["me_validate"]["insert_vender_emails"].value;
  if (empt == "") {
    alert("Please fill out the vendor email field");

  }

}

<form enctype="multipart/form-data" id="validate-me" method="post" class="form-horizontal" action="phpcode_class.php" role="form" name="me_validate" onsubmit="return required()">
  <textarea type="text" id="tags" name="insert_vender_emails" class="form-control" placeholder="">
    <?php if($n_vendors!='' ) { echo $n_vendors; } else { echo $rfq[ 'vender_emails']; } ?>
  </textarea>
</form>

我真的陷入了困境。请帮我摆脱这个...提前谢谢

【问题讨论】：

简单一点就是需要使用html5。
但我想要警告框
比 js 必须像你所做的那样。
你的提交按钮在哪里

标签： javascript php html

【解决方案1】：

试试这个，

        <script>
          function required()  
          {  
            var empt = document.forms["me_validate"]  ["insert_vender_emails"].value;  
            if (empt == "")  
            {  
              alert("Please fill out the vendor email field");  
               return false;
               }  

           }  

        </script>

【讨论】：

【解决方案2】：

请把return false;警报消息后。请检查以下代码。

<script>
    function required()  
    {  
        var empt = document.forms["me_validate"]["insert_vender_emails"].value;  
        if (empt == "")  
        {  
            alert("Please fill out the vendor email field");  
            return false;

        }  

    }  
</script>

【讨论】：

请同时使用 $.trim() 函数，它也会从文本框中删除不必要的空格。例如$.trim(empt)。
还有一件事可以请您使用 textarea 值。 var empt = $("#tags").val();或者如果没有添加 jquery，则使用以下代码。 var empt = document.getElementById("tags").value;

【解决方案3】：

当您提交表单时，它将重新加载所有页面。

使用 return false 来克服这种情况。

<script>
 function required()  
 {  
   var empt = document.forms["me_validate"]["insert_vender_emails"].value;  
   if (empt == "")  
   {  
      alert("Please fill out the vendor email field");
      return false;
   }  
 } 
</script>

【讨论】：

【解决方案4】：

可能是你没有正确选择元素，

function required()  
{  
 var empt = document.getElementById("tags").value;  
 if (empt == "")
 {  
    alert("Please fill out the vendor email field");
    return false;
 }  
}

【讨论】：

【解决方案5】：

提示弹出消息后，尝试向表单返回一些东西。

 <script>
     function required()  
      {  
        var empt = document.forms["me_validate"]["insert_vender_emails"].value;  
        if (empt == "")  
         {  
           alert("Please fill out the vendor email field");  
            return false;
         }  
          return (true);

      }  

 </script>

【讨论】：

【解决方案6】：

调用requiredfunction onsubmit()如果textarea为空则返回false

<form enctype="multipart/form-data" id="validate-me" method="post" class="form-horizontal" action="phpcode_class.php" role="form"  name="me_validate" onsubmit="return required()">
    <textarea type="text" id="tags" name="insert_vender_emails" class="form-control" placeholder="" ><?php if($n_vendors!='') { echo $n_vendors; } else { echo $rfq['vender_emails']; } ?></textarea>
    <input type="submit" value="submit" name="submit" onsubmit="required()">
    </form>

    <script>
    function required()  
    {  
    var empt = document.forms["me_validate"]["insert_vender_emails"].value;  
    if (empt == "")  
    {  
    alert("Please fill out the vendor email field");  
    return false;
    }

    }  

    </script>

【讨论】：

【解决方案7】：

使用新的 HTML5 required 属性

<textarea type="text" id="tags" name="insert_vender_emails" class="form-control" placeholder="" required></textarea>

http://www.w3schools.com/tags/att_input_required.asp

请记住，通过这种方式您无法验证输入数据。验证仅存在于应用程序的服务器端。也看看this的帖子

【讨论】：

【解决方案8】：

您可以使用 HTML5“必需”验证：

<textarea type="text" id="tags" name="insert_vender_emails" class="form-control" placeholder="" required>
       <?php if($n_vendors!='' ) { echo $n_vendors; } else { echo $rfq[ 'vender_emails']; } ?>
   </textarea>

或

只需写“return false;”在您所需功能中的警报消息之后，例如：

   function required() {


 var empt = document.forms["me_validate"]["insert_vender_emails"].value;


if (empt == "") {
alert("Please fill out the vendor email field");
return false;


}

}

【讨论】：

【解决方案9】：

<html><head>
    <script type="text/javascript">

        function submit_form() {
            if (conditions) {
                document.forms['myform'].submit();
            }
            else {
               alert("Validation Failed;");
            }
        }

    </script>
</head><body>

    …

    <input type="button" name="submit" value="submit" onclick="submit_form();"/>

</body></html>

【讨论】：

请描述您更改的内容以及原因。高质量的答案不仅显示，而且解释了解决方案。
虽然此代码可以回答问题，但提供有关如何和/或 为什么 解决问题的附加上下文将改善答案的长期价值。