尝试通过点击超链接来更改按钮的可见性以及超链接的文本。
我有按钮显示/消失,但我无法更改超链接的文本。
没有错误消息,但链接文本没有变化。
知道出了什么问题吗? (或如何更好地诊断)。
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$('#button-selector').click (function(e) {
e.preventDefault();
$('#buttons').toggleClass('hidden');
$('#button_toggle').toggle(function() {
$('a#button_selector').text('Show Buttons');
}, function() {
$('a#button_selector').text('Hide Buttons');
});
});
});
</script>
<style>
.small-text {font-size: x-small}
.medium-text {font-size: small}
.large-text {font-size: medium}
#buttons.hidden {display: none}
#buttons.shown {display: normal}
#button_toggle {padding: 1em;}
</style>
</head>
<body>
<div id="button_toggle"><a href="" id="button-selector">Hide buttons</a></div>
<div id="buttons">
<button id="small-text">Small</button>
<button id="medium-text">Medium</button>
<button id="large-text">Large</button>
</div>
</body>
</head>
答案 0 :(得分:4)
您可以将新文本基于#buttons
元素的可见性。
$('#button-selector').on("click", function(e) {
e.preventDefault();
$('#buttons').toggle(0,function(){
$(e.target).text(function(){
return $("#buttons").is(":visible") ? "Hide buttons" : "Show buttons" ;
});
});
});