我想要一个点击时有两个功能的按钮；按钮应该消失，隐藏的 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 是隐藏的，但是当我点击按钮时没有任何反应。
有什么建议吗？
最佳答案
仍然是一个错字问题......你有一个额外的闭包，删除它，它会工作:
(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/