Сменить кнопку на исходное имя после нажатия

Question

Итак, у меня есть следующий код jQuery, который перемещает список до замены другого списка при нажатии кнопки. Затем текст кнопки изменяется на «dev-языки», чтобы пользователь знал, чтобы снова нажать кнопку, чтобы вернуться к исходному списку. Когда пользователь снова нажимает кнопку, чтобы вернуться к этому первоначальному списку, как я могу вернуть кнопку к исходному тексту?

$(document).ready(function() { 

    $(".projects").on("click", function(){ 

     $(".devList").slideToggle(); 
     $(".devButton").slideToggle(); 
     $(".projects").text("Development Languages"); 
    }); 
}); 

Answer 1

Вы можете проверить, что текущий текст и изменить его в зависимости от состояния:

if ($(".projects").text() === "Development Languages") { 
    $(".projects").text("New Text"); 
} else { 
    $(".projects").text("Development Languages"); 
} 

Answer 2

Есть много способов сделать это, самый простой из которых является использование метода .text() для получения текущий текст кнопки и проверить:

var currentText = $(this).text(); 
if (currentText === "Development Languages") 
    $(this).text("Whatever the old label was"); 
else 
    $(this).text("Development Languages"); 

Однако, вы не можете иметь жестко кодировать различные этикетки в вашем JavaScript. Таким образом, вы могли бы поставить его в разметке, как это:

<button class="projects" data-alternate-label="Development Languages">Click me</button> 

... а затем более общий JavaScript, который проверяет атрибут data-, чтобы увидеть, что при нажатии на альтернативный ярлык, сохранение предыдущего текста для использования после следующий щелчок:

var $this = $(this), 
     alternateLabel = $this.data("alternate-label"); 
    $this.data("alternate-label", $this.text()); 
    $this.text(alternateLabel); 

Таким образом, вы можете иметь несколько кнопок с ассоциированными списками на той же странице, и по-прежнему нужно только обработчик один щелчок, чтобы управлять ими, как показано здесь: http://jsfiddle.net/c5584bgr/2/