jquery无法在asp.net非母版页中工作

时间:2015-04-08 16:44:42

标签: jquery css asp.net

您好我正在asp.net中创建一个网站,并试图在我的页面中包含一个jquery,但是jquery无效。 我试图将jquery插入非母版页。

我的代码是:

<%@ Page Title="Register" Language="C#" MasterPageFile="~/User.master" AutoEventWireup="true"
CodeFile="~/Register.aspx.cs" Inherits="Account_Register" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContentHolder">
<link href="Styles/register.css" rel="Stylesheet" type="text/css" />
<style type="text/css">
ul#stepForm, ul#stepForm li {
margin: 0;
padding: 0;
}
ul#stepForm li {
list-style: none outside none;
} 
label{margin-top: 10px;}
.help-inline-error{color:red;}
</style>
</asp:Content>


<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div class="container" style="padding-left: 0px; padding-right: 15px;">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h3 class="panel-title">Complete your Registration in 3 easy steps..</h3>
        </div>
        <div class="panel-body">
            <form name="basicform" id="basicform" class="basicform" method="post" action="Register.aspx">
                <div id="sf1" class="frm">
                    <fieldset>
                        <legend>Step 1 of 3</legend>
                        <div class="form-group">
                            <label class="col-lg-2 control-label" for="uname">Your Name: </label>
                            <div class="col-lg-6">
                                <input type="text" placeholder="Your Name" id="uname" name="uname" class="form-control" autocomplete="off" runat="server" />
                            </div>
                        </div>
                        <div class="clearfix" style="height: 10px;clear: both;"></div>
                        <div class="form-group">
                            <div class="col-lg-10 col-lg-offset-2">
                                <button class="btn btn-primary open1" type="button" runat="server">Next <span class="fa fa-arrow-right"></span></button> 
                            </div>
                        </div>
                    </fieldset>
                </div>

                <div id="sf2" class="frm" style="display: none;">
                    <fieldset>
                        <legend>Step 2 of 3</legend>
                        <div class="form-group">
                            <label class="col-lg-2 control-label" for="uemail">Your Email: </label>
                            <div class="col-lg-6">
                                <input type="text" placeholder="Your Email" id="uemail" name="uemail" class="form-control" autocomplete="off">
                            </div>
                        </div>
                        <div class="clearfix" style="height: 10px;clear: both;"></div>
                        <div class="clearfix" style="height: 10px;clear: both;"></div>
                        <div class="form-group">
                            <div class="col-lg-10 col-lg-offset-2">
                                <button class="btn btn-warning back2" type="button"><span class="fa fa-arrow-left"></span> Back</button>
                                <button class="btn btn-primary open2" type="button">Next <span class="fa fa-arrow-right"></span></button>
                            </div>
                        </div>
                    </fieldset>
                </div>

                <div id="sf3" class="frm" style="display: none;">
                    <fieldset>
                        <legend>Step 3 of 3</legend>
                        <div class="form-group">
                            <label class="col-lg-2 control-label" for="upass1">Password: </label>
                            <div class="col-lg-6">
                                <input type="password" placeholder="Your Password" id="upass1" name="upass1" class="form-control" autocomplete="off">
                            </div>
                        </div>
                        <div class="clearfix" style="height: 10px;clear: both;"></div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label" for="upass1">Confirm Password: </label>
                            <div class="col-lg-6">
                                <input type="password" placeholder="Confirm Password" id="upass2" name="upass2" class="form-control" autocomplete="off">
                            </div>
                        </div>
                        <div class="clearfix" style="height: 10px;clear: both;"></div>
                        <div class="form-group">
                            <div class="col-lg-10 col-lg-offset-2">
                                <button class="btn btn-warning back3" type="button"><span class="fa fa-arrow-left"></span> Back</button>
                                <button class="btn btn-primary open3" type="button">Submit </button>
                                <img src="images/register/spinner.gif" alt="" id="loader" style="display: none">
                            </div>
                        </div>
                    </fieldset>
                </div>
            </form>
        </div>
    </div>
</div>



<div id="progress_bar">
    <div id="progress"></div>
    <div id="progress_text">0% Complete</div>
</div>

 </asp:Content>

   <asp:Content ID="JavascriptContent" runat="server"     ContentPlaceHolderID="JavascriptContentHolder">
  <script type="text/javascript">

    jQuery().ready(function () {
    // validate form on keyup and submit
    var v = jQuery("#basicform").validate({
        rules: {
            uname: {
                required: true,
                minlength: 2,
                maxlength: 16
            },
            uemail: {
                required: true,
                minlength: 2,
                email: true,
                maxlength: 100
            },
            upass1: {
                required: true,
                minlength: 6,
                maxlength: 15
            },
            upass2: {
                required: true,
                minlength: 6,
                equalTo: "#upass1"
            }

        },
        errorElement: "span",
        errorClass: "help-inline-error"
    });

    $(".open1").click(function () {
        if (v.form()) {
            $(".frm").hide("fast");
            $("#sf2").show("slow");
        }
    });

    $(".open2").click(function () {
        if (v.form()) {
            $(".frm").hide("fast");
            $("#sf3").show("slow");
        }
    });

    $(".open3").click(function () {
        if (v.form()) {
            $("#loader").show();
            setTimeout(function () {
                $("#basicform").html('<h2>Thanks for your time.</h2>');
            }, 1000);
            return false;
        }
    });

    $(".back2").click(function () {
        $(".frm").hide("fast");
        $("#sf1").show("slow");
    });

    $(".back3").click(function () {
        $(".frm").hide("fast");
        $("#sf2").show("slow");
    });

});

我的母版页中有3个内容占位符,所有必需的js文件都已导入:

  <script src="Scripts/jquery-2.1.3.min.js" type="text/javascript" />
<script src="Scripts/jquery-ui-1.11.4.min.js" type="text/javascript" />
<script src="Scripts/bootstrap.min.js" type="text/javascript" />
<script src="Scripts/jquery.easing.1.3.js" type="text/javascript" />
<script src="Scripts/jquery.inputfocus-0.9.min.js" type="text/javascript" />
<script src="Scripts/jquery.main.js" type="text/javascript" />
<script src="Scripts/jquery.validate.js" type="text/javascript" />

<asp:ContentPlaceHolder id="JavascriptContentHolder" runat="server">
</asp:ContentPlaceHolder>

母版页的负责人是:

  <title></title>

<link href="Content/bootstrap.css" rel="Stylesheet" type="text/css" />
<link href="Content/bootstrap-theme.css" rel="Stylesheet" type="text/css" />
<link href="Content/normalize.css" rel="Stylesheet" type="text/css" />
<link href="Content/font-awesome.css" rel="Stylesheet" type="text/css" />
<link href="Styles/style.css" rel="Stylesheet" type="text/css" />

<asp:ContentPlaceHolder id="HeadContentHolder" runat="server">
</asp:ContentPlaceHolder>

0 个答案:

没有答案