Question

我有一个范围

<span id="spanActive">Show Inactive</span>

尝试使用JQuery更改文本，如下所示：

$('#spanActive').text(($(this).text()=='Show Inactive') ? 'Hide Inactive' : 'Show Inactive');

但没有工作。

Answer 1

使用以下代码

$('#spanActive').text(($('#spanActive').text()=='Show Inactive') ? 'Hide Inactive' : 'Show Inactive');

您需要在事件处理程序中使用this，该处理程序将在“this”中包含当前对象。

查看此link

的工作演示

如果您在span的点击事件处理程序中使用this，请尝试使用以下代码

$('#spanActive').click(function () {
    if($(this).text() == 'Show Inactive')
         $(this).text('Hide Inactive');
    else
        $(this).text( 'Show Inactive');
});

点击此链接enter link description here

查看演示

Answer 2

如果此代码未包含在事件处理程序中，为什么它会起作用，因为this之外没有上下文。

('#spanActive').on('click', function() {
     $(this).text(($(this).text()=='Show Inactive') 
                  ? 'Hide Inactive' : 'Show Inactive');
});

如果您想在事件的上下文之外使用它，那么您可以尝试这个

('#spanActive').text(function(_, txt) {
         return txt === 'Show Inactive'? 'Hide Inactive' : 'Show Inactive'
});

Answer 3

尝试

$('#spanActive').text(($('#spanActive').text()=='Show Inactive') ? 'Hide Inactive' : 'Show Inactive');

Answer 4

Demo Here

您的代码有一个'this'引用，它是引用文档，而不是span。所以使用：

  $('#spanActive').text(($("#spanActive").text() == 'Show Inactive') ? 'Hide Inactive' : 'Show Inactive');

Answer 5

this在此上下文中不起作用。试试这个：

$('#spanActive').text(($("#spanActive").text() == 'Show Inactive') ? 'Hide Inactive' : 'Show Inactive');

HTML Span文本切换

5 个答案: