我使用母版页进行登录。子页面内的登录表单需要以下方法才能激活:
<script type="text/javascript">
$(document).ready(function () {
$('#signinform').validate();
});
</script>
但是由于 signinform 位于子页面内，我如何从母版页调用它？我实际上还有其他可能性直接从子页面调用它吗？
信息
我的网络应用程序规范:
- ASP.Net Web 表单
- .Net 框架 4.6
登录大师
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Login.master.cs" Inherits="Web_WebApp.Login" %>
<!DOCTYPE html>
<html lang="en">
<head runat="server">
<title>Web - <%: Page.Title %></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link href="assets/global/css/style.css" rel="stylesheet">
<link href="assets/global/css/ui.css" rel="stylesheet">
<link href="assets/global/plugins/bootstrap-loading/lada.min.css" rel="stylesheet">
<%-- <asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>--%>
</head>
<body class="account separate-inputs" data-page="login">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
<script src="assets/global/plugins/jquery/jquery-1.11.1.min.js"></script>
<script src="assets/global/plugins/jquery/jquery-migrate-1.2.1.min.js"></script>
<script src="assets/global/plugins/gsap/main-gsap.min.js"></script>
<script src="assets/global/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/global/plugins/backstretch/backstretch.min.js"></script>
<script src="assets/global/plugins/bootstrap-loading/lada.min.js"></script>
<script src="assets/global/js/pages/login-v1.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#signinform').validate();
});
</script>
</body>
</html>
Login.aspx(内容页)
<%@ Page Title="Log In" Language="C#" MasterPageFile="~/Login.Master" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Web_WebApp.Account.Login" Async="true" %>
<%@ Register Src="~/Account/OpenAuthProviders.ascx" TagPrefix="uc" TagName="OpenAuthProviders" %>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
<!-- BEGIN LOGIN BOX -->
<div class="container" id="login-block">
<div class="row">
<div class="col-sm-6 col-md-4 col-md-offset-4">
<div class="account-wall">
<i class="user-img icons-faces-users-03"></i>
<form id="signinform" runat="server" class="form-validation animated fadeIn">
<div class="form-signin">
<div class="append-icon">
<input type="text" name="name" id="name" class="form-control form-white username" placeholder="Username" required>
<i class="icon-user"></i>
</div>
<div class="append-icon m-b-20">
<input type="password" name="password" class="form-control form-white password" placeholder="Password" required>
<i class="icon-lock"></i>
</div>
<button type="submit" id="submit-form" class="btn btn-lg btn-danger btn-block ladda-button" data-style="expand-left">Sign In</button>
<div class="clearfix">
<p class="pull-left m-t-20"><a id="password" href="#">Forgot password?</a></p>
</div>
</div>
<div class="form-password">
<div class="append-icon m-b-20">
<input type="password" name="password" class="form-control form-white password" placeholder="Password" required>
<i class="icon-lock"></i>
</div>
<button type="submit" id="submit-password" class="btn btn-lg btn-danger btn-block ladda-button" data-style="expand-left">Send Password Reset Link</button>
<div class="clearfix">
<p class="pull-left m-t-20"><a id="login" href="#">Already got an account? Sign In</a></p>
<p class="pull-right m-t-20"><a href="user-signup-v1.html">New here? Sign up</a></p>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</asp:Content>
感谢您为解决我的问题所做的努力。
最佳答案
您可以注册一个部分或 ContentPlaceholder在您的母版页中，也许在 jQuery <script... 下方的页脚中标签，然后在内容页面中使用该部分名称将内容注入(inject)到母版中。基本上，您创建另一个占位符与 MainContent 完全相同。
母版页:
...
<script type="text/javascript" src="BLAH/BLAH/jquery.js"/>
<asp:ContentPlaceHolder id="MyScripts" runat="server">
</asp:ContentPlaceHolder>
内容页面:
<asp:Content ContentPlaceHolderId="MyScripts" runat="server">
<script type="text/javascript">
$(document).ready(function () {
$('#signinform').validate();
});
</script>
</asp:Content>
但是，您的 jQuery 脚本包含似乎不起作用，很可能您正在子文件夹中工作，并且应该更改所有脚本以 / 开头。这样它们就相对于网络根目录，而不是您当前的文件夹。
关于javascript - 如何在母版页的内容页中使用 jQuery 函数？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31774136/