单击按钮添加/删除课程 [英] Add/remove class on button click
本文介绍了单击按钮添加/删除课程的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
单击按钮时JavaScript添加/删除类的问题.它只是不会执行该功能.
Problems with JavaScript add/remove class on button click. It just won't perform the function.
通读许多堆栈溢出解决方案,在这种情况下,没有一个起作用.
Read through a number of stack overflow solutions, none worked for this particular situation.
这些是元素:
// CSS
.hideWelcome{
display: none;
}
.autoHide {
display: none;
}
// JavaScript Hide Welcome
$(document).ready(function() {
$("#showFormBtn").live("click", function() {
$("#WelcomeDiv").toggleClass("fadeOutUp animated hideWelcome");
$("#formInput").toggleClass("autoHide");
});
});
// Welcome Div
<div class="container">
<div class="row">
<div id="WelcomeDiv" class="one-half column fadeInUp animated" style="margin-top: 25%">
<h4>Make a Difference</h4>
<p>Volunteer today!</p>
<div class="bounceIn animated">
<input type="button" id="showFormBtn" name="showFormBtn" class="button button-primary" value="Sign Up"/>
</div>
</div>
// Div to show
<div id="formInput" class="one-half column fadeInUp animated autoHide" style="margin-top: 25%">
<h4>HELLO YA'LL</h4>
<p>Howdy!</p>
<div class="bounceIn animated">
<input type="button" id="showFormBtn" name="showFormBtn" class="button button-primary" value="Sign Up"/>
</div>
</div>
</div>
</div>
推荐答案
As of jQuery 1.7, the
.live()
method is deprecated. Use.on()
to attach event handlers.
尝试一下:
$("#showFormBtn").on("click", function() {
$("#WelcomeDiv").toggleClass("fadeOutUp animated hideWelcome");
$("#formInput").toggleClass("autoHide");
});
这篇关于单击按钮添加/删除课程的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文