我正在使用 jQuery 通过按钮隐藏或显示元素。
按钮值应更改为:隐藏元素时显示更多
,显示元素时显示更少
。
我的html代码
<section>
<div class="contact_channel" name="<?php echo $this->id; ?>"></div>
<div class="clearfix">
<input type="button" class="showMore tiny button" value="Show more">
</div>
<div class="show_more" style="display:none;"></div>
</section>
我的 jQuery
<script type="text/javascript">
$(document).ready(function () {
$('.showMore').on('click', function () {
var section = $(this).closest('section'),
text = section.find('.show_more'), // use classes, not ID
state = text.is(':hidden');
button = $(this).find('input');
text[state?'slideDown':'slideUp'](500);
button.prop('value', function() {
return state ? "Show more" : "Show less";
});
$('input').show(200);
});
});
</script>
如您所见,这部分代码不起作用:
button.prop('value', function() {
return state ? "Show msdsdfs" : "Show lsdfsdfs";
});
$('input').show(200);
有什么想法吗?
最佳答案
您不需要查找,因为该按钮具有 showMore 类
更改此代码
button = $(this).find('input');
到
button = $(this);
关于javascript - Jquery更改文本按钮显示更多/显示更少,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22570795/