【问题标题】:JQuery validation not working on webmatrix when locally hosting?本地托管时,JQuery 验证在 webmatrix 上不起作用?
【发布时间】:2013-04-30 19:57:51
【问题描述】:

好的,所以我知道它在 JSfiddle 中工作时可以正确验证,但是当我出于某种原因尝试在本地运行它时,它没有验证。表单的 POST 还没有发生任何事情。另外,我在 IDE 中使用 twitter bootstrap 以及 validate.js 和 webmatrix。

<!DOCTYPE html>
<html lang="en">
 <head>
    <title>Weblio</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="../css/bootstrap-responsive.css" rel="stylesheet">
    <link href="../css/bootstrap.css" rel="stylesheet">
    <link href="../css/style.css" rel="stylesheet">
    <link href="../css/font-awesome.min.css" rel="stylesheet">       
</head>
<body>
    <!--navbar here-->

    <div class="navbar navTop">
        <div class="navbar-inner navbar-fixed-top">
            <a class="brand" href="/" ><i class="icon-phone-sign icon-2x"></i></a>              
            <ul class="nav">                   
                <!--<li class="active"><a href="/">Home</a></li> --> 
                <li>  
                    <form id="login" class="form-inline" method="post">
                        <input type="text" class="input-small" placeholder="Email">
                        <input type="password" class="input-small" placeholder="Password">
                        <label class="checkbox">
                            <input type="checkbox"> Remember me   
                        </label>
                        <button type="submit" class="btn btn-inverse signIn">Log in</button>
                    </form>
                </li>               
            </ul>
        </div>
    </div>
    <!--content-->
    <div id="register">
        <form id="registerform" method="POST" action=""  accept-charset='UTF-8'>
            <fieldset>
                <legend>Register</legend> <br>
                <input type="text" name="firstName" id="firstName" placeholder="First Name" maxlength="20" value=""/> <br>
                <input type="text" name="lastName" id="lastName" placeholder="Last Name" maxlength="20" value=""/> <br>
                <input type="text" name="email" id="email" placeholder="Email" maxlength="30" value=""/> <br>
                <input type="password" name="password" id="password" placeholder="Password" value=""/> <br>
                <input type="password" name="confirmPassword" id="confirmPassword"placeholder="Confirm Password" value=""/> <br>
                <input type="text" name="phoneNumber" id="phoneNumber" placeholder="Phone Number" maxlength="10" value=""/> <br>
                <input type="date" name="birthday" id="birthday" placeholder="Birthday" value=""/> <br>
                <label id="legalConfirm" for="agree"><input type="hidden" name="agree" value="0" /><input type="checkbox" name="agree" id="agree" value="1" checked="checked" /> By clicking join you confirm that you accept our <a href="/privacy.html">Privacy Policy</a> and <a href="/terms.html">Terms of Service</a>.</label>
                <input class="btn btn-primary" type="submit" name="create" value="Join"/>
                <a href="/"><button type="button" class="btn">Cancel</button></a>
            </fieldset>
        </form>
        </div>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js" type="text/javascript"></script>
        <script src="../js/jquery.validation.min.js"></script>
        <script>
           $(document).ready(function () {

                var form = $("#registerform");

                var validator = form.validate({
                    rules: {
                        firstName: { 
                            required: true,
                            minlength: 4
                        },
                        lastName: {
                            required: true,
                            minlength: 4
                        },
                        email: {
                            required: true,
                            email: true,
                            minlength: 5
                       },
                        password: {
                            required: true,
                            minlength: 6
                        },
                        confirmPassword: {
                            required: true,
                            equalTo: '#password'
                        },
                        phoneNumber: {
                            required: true,
                            phoneUS: true
                        },
                        birthday: {
                            required: true
                        },
                        agree: {
                            required: true
                        }
                    }
                });

            });
        </script>



    <!--footer-->
    <div class="navbar navbar-fixed-bottom">
    <div id="footer"> Weblio &#169; 2013  | <a href="/about.html">About</a> |<a href="/faq.html">FAQ</a> | <a href="/privacy.html">Privacy Policy</a> | <a href="/terms.html">Terms of Use</a> | <a href="/contactUs.html">Contact Us</a>
        <div id="socialFooter"> 
            <a href="http://www.facebook.com/" target="_blank" title="Like us on Facebook."><i class="icon-facebook-sign icon-3x"></i></a>
            <a href="http://www.twitter.com/" target="_blank" title="Follow us on twitter."><i class="icon-twitter-sign icon-3x"></i></a>

        </div>
    </div>
 </div>

</body>

</html>

我在 webmatrix 控制台中收到此错误。

预期的表达式第 1 行,第 1 列(指向 &lt;!DOCTYPE html&gt; 标记。)

谢谢,任何帮助都会很棒。

【问题讨论】:

  • 您确定您的本地文件也可以访问此处的插件吗?:../js/jquery.validation.min.js
  • 是的,在根目录下
  • Sparky 你是对的我不得不删除我实际上在错误文件夹中查找的路径,我不知道如何评价你的评论,但如果你回答它,我会很乐意为你的答案投票.谢谢!

标签: jquery html twitter-bootstrap jquery-validate webmatrix


【解决方案1】:

您必须确保插件确实位于此处:

../js/jquery.validation.min.js

【讨论】:

    【解决方案2】:

    嗨,Leo:我将您的代码复制并粘贴到我的 html 编辑器中,没有修改(除了链接到 google jquery 库,它在带有“html”文件扩展名的 Firefox 中运行良好。但 I.E. 8 不喜欢它并保留给我不特定的脚本错误。您在哪个浏览器中运行它?

    还有一些 HTML 内务管理是有序的: 结束输入标签 删除 !DOCTYPE html(它不应该伤害但不需要) javascript 应位于 html 标记下方的 head 标记中并包含 TYPE="TEXT/JAVASCRIPT">

    【讨论】:

    • 网站确实出现了。但是,我在页面的 js 中进行验证时遇到了问题。看看这是否适合你。如果没有,你有任何线索会很棒。
    • 我不知道我是否清楚,当您输入不符合验证要求的文本时,它应该会出错,但不会发生这种情况。
    猜你喜欢
    • 2017-03-22
    • 1970-01-01
    • 2020-11-19
    • 1970-01-01
    • 2017-05-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-18
    • 1970-01-01
    相关资源
    最近更新 更多