gpt4 book ai didi

javascript - 隐藏按钮并在单击按钮时显示隐藏的 p-tag

转载 作者:太空宇宙 更新时间:2023-11-03 21:27:51 24 4
gpt4 key购买 nike

我想要一个点击时有两个功能的按钮;按钮应该消失,隐藏的 p 标签(显示:无;)应该显示出来。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button.call-us").click(function(){
$(this).hide();
$("p.phonenumber").show();
});
});
</script>
</head>
<body>

<p class="phonenumber" style="display: none;">0271 12222</p><button class="call-us">Call us</button>
</body>
</html>

上面的代码与 w3schools testing tool 完美配合.

但是当我尝试在我的网站上直播时,没有任何反应。

我的 .js 文件 (button-phone.js) 包含以下内容:

(function($)
{
$("button.call-us").click(function(){
$(this).hide();
$("p.phonenumber").show();
});
});
(jQuery);

它包含在代码中,最下面,就在 body 标签关闭之前

<script type='text/javascript' src='http://example.com/wp-content/plugins/button/js/button-phone.js?ver=1.0.4'></script>

我已经在我的 head-tag 中导入了 jQuery 库

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.11.2'></script>

HTML

<div class="wpb_wrapper">
<p class="phonenumber">555 000 000</p>
<p><button class="call-us">Call us</button></p>
</div>

CSS

.phonenumber {
display: none;
}

p-tag 是隐藏的,但是当我点击按钮时没有任何反应。

有什么建议吗?

最佳答案

仍然是一个错字问题......你有一个额外的闭包,删除它,它会工作:

Working example

(function($) {
$("button.call-us").click(function() {
$(this).hide();
$("p.phonenumber").show();
});
})(jQuery);
.phonenumber {
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="wpb_wrapper">
<p class="phonenumber">555 000 000</p>
<p>
<button class="call-us">Call us</button>
</p>
</div>

关于javascript - 隐藏按钮并在单击按钮时显示隐藏的 p-tag,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31551089/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com