如何在不发送表单的情况下复制“需要输入”功能？

Posted 2023-03-12

【中文标题】如何在不发送表单的情况下复制“需要输入”功能？

【英文标题】：How do I duplicate 'input required' functionality without sending with the form?

【发布时间】：2015-03-12 18:16:44

【问题描述】：

我希望拥有一个内置功能，即检查和标记文本 input（在其他文本 inputs 的中间）（即在文本框周围应用默认的红色选取框）以使确保在用户单击 form submit 按钮之前填充它，而不在表单提交中包含该值。基本上，我不想将重新输入的密码与表单一起发送，但它当然需要填写（并将在客户端进行检查）。有没有“简单”的方法来做到这一点？

【问题讨论】：

@sircapsalot 你能再具体点吗？

如果它在表单中，它将在用户点击提交时发送。没有办法覆盖那个 AFAIK。您的选择是将其移出表单（这可能取决于您如何设置 html）或只是在服务器端忽略它。

未测试，但您可以尝试将表单的操作更改为哈希位置，这样它就不会去任何地方，然后如果成功将其更改回应有的状态并以编程方式重新提交

【参考方案1】：

这是您想要的一个非常简单的示例。

您可以使用 onblur、onfocus、onchange 等 javascript 事件来执行此类逻辑。

这是一个示例，向您展示如何验证字段中是否包含值。

var validate = function(element) 
    // element is HTMLInputElement
    if (element.value == "") 
        element.className = "border-red";
     else 
        element.className = "";
    

.red 
    color: red;


.border-red 
    border: 2px solid red;

<form>
    Required: <input type="text" name="required_field" onblur="validate(this)" />
    Optional: <input type="text" name="optional" />
</form>