使用三元運算符切換按鈕文本

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() 。