Изменить текст кнопки - PullRequest
Новая
       21

Изменить текст кнопки

0 голосов
/ 08 июля 2019

Я делаю проект, который мне нужно изменить текст кнопки с некоторыми эффектами затухания. Но я не могу этого сделать. Я должен нажать на кнопку, и текст должен исчезнуть, и они исчезнут вместе с другим текстом. Я использую jQuery для этого 

$("#button_fade").on("click", function(){
    if($(this).text() == "HELLO") {
         $(this).text().fadeOut(function(){
             $(this).text("WORLD").fadeIn();
         });
    }
});

Я уже пробовал этот код, но он не работает.

1 Ответ

1 голос
/ 08 июля 2019

Функция .text() возвращает строку, для которой нет метода fadeOut().Вы хотите запустить этот метод на самом элементе, вам не нужно сначала вызывать .text(). 

$("#button_fade").on("click", function() {
  if ($(this).text() == "HELLO") {
    $(this).fadeOut(function() {
      $(this).text("WORLD").fadeIn();
    });
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="button_fade">HELLO</button>

Если вы намеревались просто затухать текст, а не всю кнопку, вам нужно поместить элемент внутри кнопки и выполнить эффект затухания для этого. 

$("#button_fade").on("click", function() {
  if ($(this).text() == "HELLO") {
    $(this).children("span").fadeOut(function() {
      $(this).text("WORLD").fadeIn();
    });
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="button_fade"><span>HELLO</span></button>
...