使用三元运算符切换按钮文本

Question

我正在尝试使用三元运算符切换按钮文本，但它不起作用。

<button type="button" id="ter" >Bar</button>

$("#ter").click(function(){
   $(this).text() = 'Bar' ? 'column':'Bar';
});

可以这样做吗？ 我做错了什么？ 我知道有很多其他方法可以实现这一点，但我只需要知道这种方法是否可行？

Answer 1

你也可以试试这个：

$("#ter").click(function(){
    var newText = ($(this).text() == 'Bar') ? 'column':'Bar';
    $(this).text(newText);
});

这用$(this).text() == 'Bar'检查当前文本是否等于$(this).text() == 'Bar' 。 如果是，它将变量 newText 设置为 'column'（反之亦然）。 第二行用新文本替换旧文本。

Answer 2

您错误地使用了三元运算符。 它是：

[statement] ? [code when true] : [code when false]

您现在基本上是在测试if('Bar')它将始终返回 true。

Answer 3

你做错了，你可以改用这种方法：

$("#ter").click(function(){
   $(this).text(function (i, t) {
       return t === 'Bar' ? 'column':'Bar';
   });
});

它不起作用的原因是：

1. 您试图将结果分配给$(this).text() （使用= ）而不是比较（ ==或=== ），并且
2. 不返回任何内容来更新文本

重要的是要注意，使用 jQuery， text()方法（和大多数其他方法）在不带参数的情况下调用时是一个getter （它获取当前值），但是要将它用作setter，您必须直接传递一个参数（ $(this).text('foo') ) 或使用匿名函数（ $(this).text(function(){ return 'foo'; }) ）。 调用 getter 并比较检索到的值（或尝试分配给它）不会充当 setter。

在 jQuery 方法可用的匿名函数中，第一个参数（这里称为i ，但名称无关紧要，它始终是第一个参数）是 jQuery 返回的集合中当前“ $(this) ”对象的索引，第二个参数（此处称为t ，但名称同样无关紧要）表示该方法找到的当前（操作前）值。

参考：

• text() 。