Javascript 使提交按钮执行一个函数

基本上我有这个功能：

function testLength(){
    var input1 = document.getElementById("input1").value
    var input2 = document.getElementById("input2").value

    alert("test")
    if (input1.length < 2 && input2.lenght < 2){
        alert("Please enter more then one symbol");
        return false
    }
}

函数testLength（）{
var input1=document.getElementById（“input1”）.value
var input2=document.getElementById（“input2”）.value
警报（“测试”）
if（input1.length<2&&input2.length<2）{
警告（“请输入多个符号”）；
返回错误
}
}

以及一项建议：

<input type="text" name="input1" id="input1">
<input type="text" name="input2" id="input1">
<input type="submit" onclick="testLength();" value="press me">

---

其想法是，如果输入长度为1个字符，则不允许提交，但即使我的输入长度为1个字符，它似乎也不会进入if station（我假设）状态，该状态应停止提交按钮的提交。了解原因吗？

使用onsubmit事件：

<form onsubmit="return testLength();">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <input type="submit" value="press me">
</form>

---

有关更多信息，请阅读：

您应该查看类似

的内容

---

如果函数返回false，函数将不会被提交。

假设您的输入和提交按钮位于

元素内，则表单的默认行为（实际提交）将发生。您可能需要为表单的

submit

事件添加一个事件侦听器，并在其中进行验证

HTML

<form id="my-form">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <input type="submit" value="press me">
</form>

<form id="my-form">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <input type="submit" id="submit" value="press me">
</form>

Javascript

var form = document.getElementById('my-form');
form.onsubmit = function() {
    var input1 = document.getElementById("input1").value
    var input2 = document.getElementById("input2").value

    alert("test")
    if (input1.length < 2 && input2.lenght < 2){
        alert("Please enter more then one symbol");
        return false
    }
}

var-form=document.getElementById（'my-form'）；
form.onsubmit=函数（）{
var input1=document.getElementById（“input1”）.value
var input2=document.getElementById（“input2”）.value
警报（“测试”）
if（input1.length<2&&input2.length<2）{
警告（“请输入多个符号”）；
返回错误
}
}

除了onsubmit，您还可以使用eventListener

例如：

HTML

<form id="my-form">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <input type="submit" value="press me">
</form>

<form id="my-form">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <input type="submit" id="submit" value="press me">
</form>

JAVASCRIPT

    document.getElementById('submit').addEventListener('click', testLength);
    function testLength(){
    var input1 = document.getElementById("input1").value
    var input2 = document.getElementById("input2").value

    alert("test")
    if (input1.length < 2 && input2.lenght < 2){
        alert("Please enter more then one symbol");
        return false
    }
}

document.getElementById（'submit'）.addEventListener（'click'，testLength）；
函数testLength（）{
var input1=document.getElementById（“input1”）.value
var input2=document.getElementById（“input2”）.value
警报（“测试”）
if（input1.length<2&&input2.length<2）{
警告（“请输入多个符号”）；
返回错误
}
}

---

事件侦听器不仅可以用于querySelector和getelementByID，还可以用于您在文档中定义的任何目标。

Ok，所以我设法停止了submit按钮的工作。我仍然不能让它通过if语句，因为某种原因，无论我输入什么，它都返回false（条件）：sw您使用的是什么代码？在你的问题中，代码中有一个拼写错误：lenght而不是length*facepalm*，所以我不能正确拼写。现在一切正常。非常感谢。