Javascript java脚本表单验证错误_Javascript_Html

Javascript java脚本表单验证错误

javascript html

Javascript java脚本表单验证错误,javascript,html,Javascript,Html,我第一次尝试了java脚本验证，我分别完成了每个字段，当涉及到多个字段时，它不起作用，当我验证脚本时需要遵循哪些步骤，有人能帮我吗 <script type="text/javascript"> function validation(){ var nameval1=0; var nameval2=0; var nameval3=0; var myname=document.getElementById("myname").val

我第一次尝试了java脚本验证，我分别完成了每个字段，当涉及到多个字段时，它不起作用，当我验证脚本时需要遵循哪些步骤，有人能帮我吗

    <script type="text/javascript">

    function  validation(){

    var nameval1=0;
    var nameval2=0;
    var nameval3=0;
    var myname=document.getElementById("myname").value;
    var password=document.getElementById("password").value;
    var male=document.getElementById("male").value;
    var female=document.getElementById("female").value;

    // text box validation
    if(myname==""){
        alert("please enter name");
        nameval1=nameval1+1;
    }else{

         nameval1=0;
         }

        if(password==""){
        alert("please enter password");
        nameval2=nameval2+1;
    }else{

         nameval=0;
         }
    // gender validation
    if(male=="" && female==""){

        alert("please choose gender");
        nameval3=nameval3+1;
    }else{

         nameval3=0;
         }
    // returning value
    if((nameval1)!=0 && (nameval3)!=0 &&(nameval3)!=0){
        return false;
    }else
    {
        return true;
    }


    </script>

     </HEAD>

     <BODY>
     <form action="https://www.youtube.com" name=" " onSubmit=" return validation()">

    <fieldset>
    <label>Validation Form
        Name :      <input type="text"  name="name" id="myname"></br>

        Password : <input type="password" name="password" id="password"></br>

               <input type="radio" id="male" name="gender"> Male
               <input type="radio" id="female" name="gender"> Female
               </br>

        <input type='submit'  value='mysubmit'>
    </label>
    </fieldset>

     </form>


函数验证（）{
变量nameval1=0；
变量nameval2=0；
变量nameval3=0；
var myname=document.getElementById（“myname”）.value；
var password=document.getElementById（“密码”）.value；
var male=document.getElementById（“male”）.value；
var female=document.getElementById（“female”）.value；
//文本框验证
如果（myname==“”）{
警报（“请输入名称”）；
nameval1=nameval1+1；
}否则{
nameval1=0；
}
如果（密码==“”）{
警报（“请输入密码”）；
名称2=名称2+1；
}否则{
nameval=0；
}
//性别确认
如果（男性==“”&女性==“”）{
警告（“请选择性别”）；
nameval3=nameval3+1；
}否则{
nameval3=0；
}
//返回值
如果（（nameval1）！=0&&（nameval3）！=0&&（nameval3）！=0）{
返回false；
}否则
{
返回true；
}
验证表
姓名：

密码：

男性的
女的

通过使用

prevent default

并检查空值/单击的收音机，您可以用更少的代码执行此操作：

$("input[type=submit]").click(function(e){

  if($("#myname").val() == ""){
    e.preventDefault();
    alert("Name cant be empty")    
  }

  if($("#password").val() == ""){
    e.preventDefault();
    alert("Password cant be empty")    
  }

  if(!$("input[type=radio]").is(":checked")){
    e.preventDefault();
    alert("Gender cant be empty")    
  }

 });

jmore009已经给出了一个很好的答案，但它有一些问题

下面是一个示例，它是对jmore009解决方案的更新

$("input[type=submit]").click(function(e){

  if(!$("#myname").val().trim()){
    e.preventDefault();
    alert("Name can't be empty")    
  }

  if(!$("#password").val().trim()){
    e.preventDefault();
    alert("Password can't be empty")    
  }

    if(!$("input[type=radio]").is(":checked")){
    e.preventDefault();
    alert("Gender can't be empty")    
  }

});

如果您不知道，请将脚本放在

标记之前。否则，由于加载时间不同，JavaScript可能找不到必要的DOM元素。

为什么您要让事情变得复杂…除非您正在验证字段的数据，否则不要使用JavaScript验证。如果问题只是字段必须强制执行。。您可以使用标签的

required=“required”

属性

所有浏览器都支持它…

uhh您唯一添加的是

.trim（）

，以删除空白。是的，这也很好，可以添加（您还可以分解验证更多…这只是一个简单的示例）但是说

，它有一些问题。

和

这里有一把更好的小提琴

非常可笑，因为这是98%我的代码。如果听起来很可笑，我很抱歉。英语不是我的母语，我完全不想说你的脚本错了，这是我自己的脚本。我想说的是，尽管它是正确的解决方案是，有

==

相等运算符（这被认为是一种不好的做法）。此外，检查某个内容是否为

x==“”可以写成<代码> x>代码>。我承认这是你的代码和<代码>问题< /C>可能不是正确的词，但是我没有想出更好的东西，但是我想更新你的脚本。下次，考虑评论其他用户的答案，建议轻微改进。是的，1号。所有的当前浏览器支持它，但是几个。旧版本不包括（令人震惊的）IE9及以下版本。另外，一些移动浏览器也不支持它。2.它不是傻瓜式的，在Safari中，它会停止表单验证，但不会给出任何指示（例如错误消息）这是错误的。如果您使用Jquery Selected之类的东西，它也不会在任何浏览器中向您发出验证警告，让用户感到困惑。这将有助于我们了解您预期会发生什么以及什么不起作用。当您从单个验证转到多个验证时，您的验证的哪一部分会被破坏？
$("input[type=submit]").click(function(e){

  if(!$("#myname").val().trim()){
    e.preventDefault();
    alert("Name can't be empty")    
  }

  if(!$("#password").val().trim()){
    e.preventDefault();
    alert("Password can't be empty")    
  }

    if(!$("input[type=radio]").is(":checked")){
    e.preventDefault();
    alert("Gender can't be empty")    
  }

});