jquery - 为什么什么都没有形成?

标签 jquery html css

$document.ready(function(){




    var form = $("contact_form");
    var FName = $("fname"); //Creates Variables from forms 
    var FNameInfo = $("fnameInfo");
    var LName = $("lname");
    var Tele = $("tele"); 
    var Email = $("email"); 

    FName.blur(validateFName); 

    form.submit (function (){

        if (validateFName & validateSName & validateTele() & validateEmail() ){ //If it passes all of these then return true 

        return true;
    }else  {
                return false;
              }

        }); 

        function validateFName () {
        if (FName.val().length < 5 ){                        
                FName.addClass("error");
                FNameInfo.text("Incorrect Name");
                FNameInfo.addClass("error");
                return: false; 




        }



       else {

                FName.removeClass("error"); 
                FNameInfo.text("Whats your fname" ); 
                FNameInfo.removeClass("error"); 
                return true; 
       }
        }
    }); 




<!DOCTYPE html>
<html>
    <head>
        <meta charset = "utf-8/">
        <title>this is my first</title>
        <link rel = "stylesheet" href = "SecCustom.css" type = "text/css"/> 
        <script type = "application/javascript" src="js/jquery-1.11.3.min.js"></script>
        <script type = "application/javascript" src="js/Validation.js"></script>

        <script>

        </script>

    </head>
    <body>


        <div id = "container">
        <form action="" method="get" id = "contact_form">
            <div> 
                      <label for ="name">First Name </label>
                      <input id = "fname" name = "fname" type = "text"/> 
                    <span id = "fnameInfo" > Whats your first name?</span>
           </div>
            <div>
               <label for ="lname">Last Name </label>
               <input id = "lname" name = "lname" type = "text"/> 
               <span id = "lnameInfo" > Whats your last name?</span>
            </div>

            <div>
               <label for ="tele">Telephone </label>
               <input id = "tele" name = "tele" type = "text"/> 
               <span id = "fnameInfo" > Telephone</span>
            </div>

            <div>
               <label for ="email">email </label>
               <input id = "email" name = "email" type = "text"/> 
               <span id = "fnameInfo" > Whats your last email?</span>
            </div>

            <div>
               <input id = "send" name = "send" type = "submit" value = "send"/> 
            </div>


        </form>

        </div>
    </body>
</html>


#contact_form textarea.error{
    background:#f8dbdb;
    border-color: #e77776;


}





#error {

    margin-bottom:20px;
    border:1px solid #efe;


}

我正在尝试创建一个表单并使用 JQuery 进行验证我正在尝试验证表单的第一部分,即“fname”又名名字,但似乎没有发生任何事情插件是否有错误?我将 Jquery 代码复制到一个单独的脚本中并创建了一个 src 路径,当我将代码从脚本复制并粘贴到脚本标记之间的 HTML 页面时仍然没有,我试图通过在中插入警报来运行测试以查看 JQuery 是否工作HTML 文件写着“Hello World”并且它起作用了所以我真的很困惑为什么什么都没有发生 :s

最佳答案

您的选择器有误。

这样做:

var form = $("contact_form");

您正在选择标签名称等于“contact_form”的 DOM 元素。您必须将其替换为:

var form = $("#contact_form");

你应该阅读这个tutorial .

关于jquery - 为什么什么都没有形成?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33588278/

相关文章:

header 中的 Javascript 和 css vs 包含单独的文档?

html - 如何使固定导航栏可滚动

javascript - 非常小的 jsfiddle 的 DOM 泄漏与 jquery

javascript - 仅在移动设备上输入整数

javascript - Resharper 与 QUnit - 引用文件

javascript - 下拉 Materialise 不工作(没有下拉)

html - anchor 内的div

html - 如何设置子div元素从其位置到页面底部的高度?

jquery - 更改和模糊不适用于 jquery 中的部分标记

html - 在另一个 div 中居中包含可变大小文本的 3 列 div