问题描述
我是jQuery编码的新手,我的代码需要帮助。 我有一个按钮,可以让我显示网站上的隐藏部分,但是即使我希望他消失,此刻此按钮仍然存在。 我的网站是使用Wordpress和Divi构建的。
使用以下代码,您将尝试使用CSS中的hide / show值进行最新的尝试。
<style type="text/css">
.rv_button.closed:after {content:"";}
.rv_button.opened:after {content:"";}
.hide {display:none;}
.show {display:block;}
</style>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#reveal').hide();
jQuery('.rv_button').click(function(e) {
e.preventDefault();
jQuery("#reveal").slideToggle();
jQuery('.rv_button').toggleClass('opened closed');
});
});
</script>
如果要查看其外观,可以在此处查看示例: :
1楼
Lazar Ljubenovi?
1
2019-02-12 17:01:50
你切换名为类opened
和closed
,而你的CSS显示, hide
和show
是影响元素在决赛中的存在渲染页面的。
另外,大多数课程可能都不需要。
您可以只添加hide
一个。
将您的最后一条平凡的机会
jQuery('.rv_button').addClass('hide');
如果您已经将show
class应用于按钮,则您的原始想法很有意义。
您只需要更改类以匹配您在样式中定义的类即可。
jQuery('.rv_button').toggleClass('show hide');
2楼
vmf91
0
已采纳
2019-02-12 17:05:11
只需在您的click函数中添加$(this).hide()
即可。
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#reveal').hide();
jQuery('.rv_button').click(function(e) {
e.preventDefault();
jQuery("#reveal").slideToggle();
jQuery('.rv_button').toggleClass('opened closed');
// Hide button
$(this).hide()
});
});
</script>
3楼
B.Felix
0
2019-02-12 17:14:06
谢谢大家参与我的问题。 我设法使用了@ vmf91的解决方案,该解决方案就像一个魅力。 再次感谢大家,度过愉快的一天。
4楼
Ricardo Montuan
0
2019-02-12 17:15:02
您要在单击按钮后将其删除吗? 如果是这样,您只需要在button事件中插入以下行:
jQuery(this).hide();
完整的点击事件:
jQuery('.rv_button').click(function(e) {
e.preventDefault();
jQuery(this).hide();
jQuery("#reveal").slideToggle();
//You don't need this if you want to hide the button
//jQuery('.rv_button').toggleClass('opened closed');
});