jquery - 单击后更改元素的文本或 HTML

标签 jquery

我想通过点击更改 span 元素的文本:

$('.int-bank h2 span').text('Open List');
$('.int-bank h2').bind("click", function (e) {
    $(this).next("p").toggleClass("lblock");
    var spn = $(this).find("span");
    spn.text('Close List');
});

但在第二次单击时,跨度的文本不会更改为“打开列表”。我怎样才能做到这一点?

最佳答案

太糟糕了,没有toggleText();-)。您必须自己检查该值:

spn.text(spn.text() == 'Open List' ? 'Close List' : 'Open List');
<小时/>

嘿,当我这样做时,为什么不创建一个 toggleText():

$.fn.toggleText = function (text1, text2) {
    var curText = this.text();
    this.text(!$.trim(curText) ? text1 : 
        (curText == text1 ? text2 : text1));
    return this;
};

然后像这样简化你的代码:

$('.int-bank h2 span').text('Open List');
$('.int-bank h2').click(function () {
    $(this).next('p').toggleClass('lblock');
    $(this).find('span').toggleText('Open List', 'Close List');
});

关于jquery - 单击后更改元素的文本或 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4746792/

相关文章:

jquery - 带有 Codeigniter 后端的 PhoneGap

javascript - 如何使 block 中的所有链接在新选项卡中打开

javascript - jQuery post方法参数传递失败

javascript - "input"事件的多个事件监听器

jquery - spy 卷轴不工作

javascript - 使用 javascript 添加类后,延迟从按钮中删除类

javascript - 使用 .prop() 创建全选复选框,但不希望删除该复选框

javascript - 在 Javascript 中退出函数之前强制加载页面

jquery - 表单输入字段没有相同的间距

javascript - 来自一系列 getJSON() 调用的合并结果对象