验证表单中的空字符串

wmvff8tz 于 2021-09-13 发布在 Java

关注(0)|答案(2)|浏览(603)

我有一个表单，它接受用户的输入并将其连接到url（用函数编写）。如何检查users值是否为空，并在表单下方显示一条警告，提示“请输入有效的店铺url”。不用重新编写我的整个函数！救命啊！
输入表格

<form id="url">
        <input type="text" name="urlName">
        <button onclick="return myFunction()">Try it</button>
    </form>

javscript函数

document.getElementById("url").addEventListener("submit", myFunction);

    function myFunction() {
            let myForm = document.getElementById("url");
            let formData = new FormData(myForm);
            EndOfUrl = sanitizeDomainInput(formData.get("urlName"));
            newUrl = redirectLink(EndOfUrl);
            window.location.href = newUrl;
            return false;
        }

    function sanitizeDomainInput(input) {
        input = input || 'unknown.com'
        if (input.startsWith('http://')) {
            input = input.substr(7)
        }
        if (input.startsWith('https://')) {
            input = input.substr(8)
        }

        var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\.[a-zA-Z]{2,3})$/)
        return regexp.test(input) ? input : 'unknown.com';     
    }

    function redirectLink(domain) {
        return `https://dashboard.getorda.com/signup/?state=${domain}`;
    }

检查空字符串我没有工作

function valInput() {
        if (input.value.length === 0){
            alert("need valid store URL")
        }
    }

JavaScript Html forms String

来源：https://stackoverflow.com/questions/68308787/validate-empty-string-in-form

2条答案

按热度按时间

vbkedwbf1#

在里面 myFunction 您可以在创建的新示例之后简单地添加此代码 FormData :

if (formData.get("urlName") === "")
    return alert('asdsa')

它将停止整个功能，因为 return 并会提醒您尚未在输入框中输入任何内容。
实际上，整个代码有点错误
以下是javascript代码的正确版本：

document.getElementById("url").addEventListener("submit", (event) => {
    event.preventDefault()

    let myForm = document.getElementById("url");
    let formData = new FormData(myForm);
    if (formData.get("urlName").length === 0)
        return alert('Provide valid url')
    EndOfUrl = sanitizeDomainInput(formData.get("urlName"));
    newUrl = redirectLink(EndOfUrl);
    window.location.href = newUrl;
    return false;
});

function sanitizeDomainInput(input) {
    input = input || 'unknown.com'
    if (input.startsWith('http://')) {
        input = input.substr(7)
    }
    if (input.startsWith('https://')) {
        input = input.substr(8)
    }

    var regexp = new RegExp(/^(([a-zA-Z]{1})|([a-zA-Z]{1}[a-zA-Z]{1})|([a-zA-Z]{1}[0-9]{1})|([0-9]{1}[a-zA-Z]{1})|([a-zA-Z0-9][a-zA-Z0-9-_]{1,61}[a-zA-Z0-9]))\.([a-zA-Z]{2,6}|[a-zA-Z0-9-]{2,30}\.[a-zA-Z]{2,3})$/)
    return regexp.test(input) ? input : 'unknown.com';     
}

function redirectLink(domain) {
    return `https://dashboard.getorda.com/signup/?state=${domain}`;
}

你打电话给 myFunction 两次，您甚至都不会避免发送表单，因此无论您在 myFunction .
在html中，您不需要按钮。你可以加上 input:submit 这将自动触发函数onclick。以下是正确的html代码：

<form id="url">
    <input type="text" name="urlName">
    <input type="submit">
</form>

赞(0）回复(0）举报 2021-09-13

nx7onnlm2#

您可以将onblur处理程序添加到输入。

function validate(val) {
  if(val.trim() === "") {
    alert("Field is required");
  }
}

<input type="text" name="urlName" onblur="validate(this.value)">

赞(0）回复(0）举报 2021-09-13

我来回答

验证表单中的空字符串

2条答案

相关问题

热门标签

最新问答