0

我想控制我的表单以获取所需的输入文本，并且我在 javascript 中创建了一个函数。但是当我单击按钮时，我没有填写必填字段，没有出现消息，我可以转到其他页面。功能是：

function Validate(){

    // create array containing textbox elements
    var inputs = [document.getElementById('firstname1')];

    var error;

    for(var i = 0; i<inputs.length; i++)
    // loop through each element to see if value is empty
    {
        if(inputs[i].value == '')
        {
            error = 'Please complete all fields.';
            alert(error);
            return false;
            }
    }
 }

表格的部分是：

<form name="password" onsubmit="return Validate()" method="post" id="password" action="#">
    <input type="submit" value="Proceed"  id="submit1" onclick="displayform2()" class="button" style=" margin-top: -40px;margin-left: 60%;width: 25%" disabled>

我注意到如果我推迟按钮中的 onclick 方法它可以工作，但我应该在按钮上有这个方法......我该如何解决这个问题？请帮助我

 function displayform2() {
               /*For desktop*/
                if (document.getElementById('desktop1').style.display=='block') {
                    document.getElementById('desktop1').style.display='none';
                    document.getElementById('desktop2').style.display='block';
            document.getElementById('desktop3').style.display='none';

        }
         /*For mobile*/
         if (document.getElementById('mobile1').style.display=='block') {
                    document.getElementById('mobile1').style.display='none';
                    document.getElementById('mobile2').style.display='block';
            document.getElementById('mobile3').style.display='none';
                }}

它在页面中打开另一个表单......所以当我单击按钮时，第一个表单消失了，第二个表单显示

4

3 回答 3

0

你有这个：var inputs = [document.getElementById('firstname1')];

然后你尝试循环通过它。我打赌firstname1是一个字段，所以它要么是 null（如果该字段不存在），要么是一个只有一个元素（字段）的数组。看起来您正在尝试检查所有必填字段，所以这不起作用。

我不是你最终想要做的 100%，但如果你使用像 jQuery 这样的框架，它可能会容易得多；否则，您将不得不为不同的浏览器做一些复杂的案例处理。

于 2013-11-07T19:26:02.980 回答
0

在您的代码中没有任何地方调用提交。这就是为什么 onsubmit 处理程序中的函数没有被触发的原因。如果您希望按钮提交表单，它需要是一个提交按钮。

于 2013-11-07T19:28:59.633 回答
0

你的例子有点不清楚。例如，您尝试验证是否已在输入“firstname1”中输入了一个值，但您的 HTML 中没有该元素的标记。

我怀疑您要做的是验证表格是否已填写。类似以下内容（验证输入“firstname1”）将完成这项工作：

$(document).on("click", "#submit1", function(){
    if($("#firstname1").val() == "" || $("#firstname1").val() == null){
        alert("Please complete all fields.");
    }
});

这里的工作示例

以上需要 jQuery，但也可以转换为 vanilla JavaScript。

通过包含以下代码，在文档的“head”部分加载 jQuery 库：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
于 2013-11-07T19:33:49.953 回答