我试图隐藏一个 div (class="login-form"),直到使用 jQuery 在我的 HTML 页面上按下登录按钮。但是,当我单击该按钮时,不会显示登录表单。这是为什么?
谢谢!
HTML-------------------------------------------- ------------------------------
<?php /* Template Name: Virtual-tour */ ?>
<head>
<link rel="stylesheet" href="stylus/main.css"/>
<link href='https://fonts.googleapis.com/css?family=Alegreya+Sans' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- <script src=js/showLogin.js></script>
<script src=js/showCreateAccount.js></script>
<script src=js/submitLogin.js></script>
<script src=js/submitCreateAccount.js></script>
<script src=js/validate.js></script> -->
</head>
<body>
<div class="virtual-tour-media-player">
<span> placeholder for media player</span>
</div>
<div class="instructions">
Are you a family member or friend of a veteran on this memorial?</br></br>
<span id="instruction-sub">
Login or Create Account below to add additional information and memories.</br>
</span>
<button id="login">Login</button>
<button id="create-account">Create Account</button>
</div>
<div class="login-form">
<form>
<input type="text" placeholder="Email Address" />
<input type="password" placeholder="Password" />
</form>
</div>
<script>
$(document).ready(function() {
$("#login").click(function(){
$('.login-form').show();
});
$('#create-account').click(function{
$(".create-account-form").show();
});
});
</script>
Stylus(CSS 预处理器,语法与 CSS 非常相似)------------------------------------ ------------------
body
color #ffffff
background-color #292929
font-family 'Alegreya Sans', sans-serif
.virtual-tour-media-player
width 90%
height 40%
margin auto
border 3px solid white
.instructions
padding-top 30px
margin auto
margin-top 5%
font-size 100%
width 45%
height 22%
text-align center
background-color #740600
box-shadow 2px 2px 2px 2px #232421
#instruction-sub
font-size 15px
//color #4d4d4d
button
line-height 1.8
border none
color #f1f1f1
background-color #0c083e
margin auto
margin-top 10%
width 40%
height 15%
button:hover
background-color #292929
.login-form
display none
最佳答案
解决方案:第二个 .click() 函数(针对 #create-account)缺少函数中的括号。它以其他方式工作。
关于javascript - 单击按钮时.show() 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38839911/