我正在使用P标记来展开/折叠我的代码目前正在使用的内容。但我也想在点击时更改P标签文本。这样做的最佳方式是什么?
这是我的代码:
的jQuery
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".content").hide();
//toggle the componenet with class msg_body
jQuery(".heading").click(function() {
jQuery(this).next(".content").slideToggle(500);
});
});
</script>
HTML
<p class="heading">Click here for more info... </p>
<div class="content">
<span style="font-size: 14px; color: rgb(6, 78, 137);">
<b>Documents Required</b>
</span>
</div>
单击标题类时,将显示内容类。想点击“点击此处获取更多信息...”文字,点击此处即可更改为“点击此处获取更少信息...”。
感谢您的帮助!
答案 0 :(得分:1)
完成所要求的完整示例:
// This extends jQuery's functions and adds a toggleText method.
jQuery.fn.extend({
toggleText:function(a,b){
if(this.html()==a){this.html(b)}
else{this.html(a)}
}
});
jQuery(document).ready(function() {
jQuery('.heading').click(function() {
jQuery(this).toggleText('My first text','My second text');
jQuery(this).next(".content").slideToggle(500);
});
});