每当单击父 anchor 标记时,我都会尝试切换跨度的文本。这是 HTML:
<h2 class="panel-title">
<a href="#collapse1">
<span class="ui-hidden-accessible">expand</span>
</a>
</h2>
虽然这是每次点击 anchor 标记时调用的 changeText
函数的 javascript
function changeText() {
var taskDivClass = $('.panel-title a');
$(taskDivClass).each(
function() {
var $this = $(this);
if($this.hasClass('collapsed')) {
var taskDivSpanText = $this.find('.ui-hidden-accessible');
taskDivSpanText.html('expand');
}
else {
var taskDivSpanText = $this.find('.ui-hidden-accessible');
taskDivSpanText.html('collapse');
}
}
);
}
我正在使用 each
方法,因为页面中有多个这样的 block ,对于每个点击事件,只有特定的范围应该改变。
.collapsed
类在用户点击 anchor 标记时动态切换。
问题是当用户第一次点击 anchor 标签时,文本没有切换。下次点击它。
我真的不确定我在这里错过了什么。如果有人有线索,请指出。
最佳答案
如果您不想添加/删除类,请使用 .html()。
希望对你有帮助
$(document).ready(function(){
$("a").click(function(){
var spanClick= $(this).find('.ui-hidden-accessible');
if (spanClick.html()==="Expand"){
spanClick.html("Collapse");
}
else{
spanClick.html("Expand");
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2 class="panel-title">
<a href="#collapse1" >
<span class="ui-hidden-accessible">Expand</span>
</a>
</h2>
关于javascript - jQuery 文本在第一次点击时不切换,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35881158/