javascript - 如何使用 javascript 对 html 中的两个提交按钮进行两种不同的验证

标签 javascript html

我有一个名为“添加”和“搜索”的两个提交按钮。当我单击“添加提交”按钮时,它会使用定义的验证方法进行正确的验证。 现在我有另一个“搜索提交”按钮并定义了其功能,但它不起作用,我的意思是它没有进行任何验证

<!DOCTYPE html>
<html>
    <head>
    <title>INFORMATION</title>
<script type="text/javascript">

function svalidate(){

   if (document.myForm.firstname.value=="" && document.myForm.lastname.value=="" &&     document.myForm.age.value=="" && document.myForm.gender.value==""){
       alert("Please enter any one value");
       return false;
   }   
}
function validate() {

    if (document.myForm.firstname.value==""){
        alert("Please provide the firstname");
        return false;   
    }

    if (document.myForm.lastname.value=="" ){
    alert("Please provide the lastname");
    return false;
    }

    if (document.myForm.age.value=="" || isNaN(document.myForm.age.value) ||     document.myForm.age.value<1){
    alert("Please provide the valid age in Integer");
    return false;
    }

    if (document.myForm.gender.value=""){
    alert("Please provide the gender");
    return false;
    }

}      
</script>
</head>
    <body>
        <form action = "/~neeraj/cgi-bin/test.py" name="myForm" method="post">
            <table cellspacing="3" cellpadding="2" border="1">
                <tr>
                    <td> FirstName:* </td>
                    <td> <input type="text" name="firstname" /></td>
                </tr>
                <tr>
                    <td>LastName:* </td>
                    <td> <input type="text" name="lastname" /></td>
                </tr>

                <tr>
                    <td>Age:* </td>
                    <td><input type="text" name="age" /></td>
                </tr>

                <tr>
                    <td>Gender:* </td>
                    <td><input type="radio" name="gender" value="male" /> Male
                        <input type="radio" name="gender" value="female" /> Female</td>
                </tr>
            </table>

                <br>
                <input type="submit" name="submit" value="ADD"     onclick="return(validate())">
                <input type="reset" name="reset" value="RESET">
                <input type="submit" name="search" formmethod="post"     formaction="/~neeraj/cgi-bin/search.py" value="SEARCH" onclick="return(svalidate())">
        </form>

   </body>
</html>

最佳答案

这部分代码不起作用。

 if (document.myForm.gender.value=""){
    alert("Please provide the gender");
    return false;

您需要像数组一样对单选按钮进行寻址。

请参阅此问题以了解如何执行此操作

Validation of radio buttons with Javascript

将 Svalidate 函数更改为此

function svalidate(){    

    if (document.myForm.firstname.value=="" && document.myForm.lastname.value=="" && document.myForm.age.value=="" && ( document.myForm.gender[0].checked == "0") && ( document.myForm.gender[1].checked == "0")){
            alert("Please enter any one value");
            return false;   
        }   
    }

此外,您还需要在验证函数中进行相同的更改。查看我的WORKING FIDDLE要查看这两个更改...

关于javascript - 如何使用 javascript 对 html 中的两个提交按钮进行两种不同的验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19629578/

相关文章:

javascript - 选择第一个 child 的元素

javascript - 如何检查浏览器对 HTML5 表单属性的支持?

javascript - Jquery 可折叠区域

PHP Mail 表单不在 Linux 服务器上发送电子邮件

javascript - 使用 reduce() 改变数组的顺序

javascript - 为什么canvas的drawImage缩放比例不一致?

javascript - 具有外部源和正文的脚本标签

javascript - 模拟双击拖动结束 - jquery UI

javascript - 通过 Ajax 加载 CSV 数据以在 Highcharts 中显示

javascript - 尝试延迟 for 循环直到加载 div