当有需要填写的文本字段时如何弹出提示？答案

【问题标题】：How to make a pop-up alert when there are text fields that are needed to be filled up?当有需要填写的文本字段时如何弹出提示？
【发布时间】：2014-03-14 08:24:17
【问题描述】：

我有一个添加客户信息的表单。我只想知道如何制作一个弹出警告框，警告用户他/她忘记填写重要的文本字段。我不擅长 HTML 或 JavaScript，所以我需要这方面的帮助。

【问题讨论】：

标签： html popup alert

【解决方案1】：

简直太简单了:)

只需在输入字段（文本字段/文本区域等）中使用“必需”参数即可。

<form method="post" name="Form" onsubmit="" action="">
    <input length="20" required=""></input>
    <input type="submit" value="Submit"></input>
</form>

当用户尝试提交表单时，如果 textinput 为空，则会显示一些文本！仅当标记为必需的每个输入都填充了文本时，才能提交表单。看看这个简单的小提琴：

http://jsfiddle.net/UL5pC/

【讨论】：

【解决方案2】：

你可以使用下面的例子

<html>
<head>
<script>
function validateForm() {
    var x = document.forms["myForm"]["fname"].value;
    if (x == null || x == "") {
        alert("Name must be filled out");
        return false;
    }
}
</script>
</head>
<body>

<form name="myForm" action="js"
onsubmit="return validateForm()" method="get">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>

</body>
</html>

【讨论】：

两个链接都坏了
我删除了那些链接

【解决方案3】：

从this answer查看此代码示例：

当然，用您的字段替换输入字段，如果缺少任何字段，请设置您自己的消息。

<script type="text/javascript">
    function validateForm()
    {
    var a=document.forms["Form"]["ans_a"].value;
    var b=document.forms["Form"]["ans_b"].value;
    var c=document.forms["Form"]["ans_c"].value;
    var d=document.forms["Form"]["ans_d"].value;
    if (a==null || a=="",b==null || b=="",c==null || c=="",d==null || d=="")
      {
      alert("Please Fill All Required Field");
      return false;
      }
    }
    </script>

<form method="post" name="Form" onsubmit="return validate()" action="">
<textarea cols="30" rows="2" name="ans_a" id="a">
<textarea cols="30" rows="2" name="ans_b" id="b">
<textarea cols="30" rows="2" name="ans_c" id="c">
<textarea cols="30" rows="2" name="ans_d" id="d"></textarea>
</form>

【讨论】：

【解决方案4】：

import React from 'react';
const Uapp =()=>{
    return(
        <>
        <p>
         Type Your name <input required />
        </p>
        </>
    );
}
export  default Uapp;

注意 - 仅当用户未在输入框中输入任何内容时，才在警报消息的输入标记中添加所需的语法。

【讨论】：