Переключить текст элемента с помощью jquery

Question

Как переключить текст элемента с помощью jQuery .click(), .toggle() и .text()?

Вы можете использовать переменную, чтобы удерживать текст, который нужно переключить.

Но, пожалуйста, никаких классов для включения и выключения с помощью .toggle().

Answer 1

Один из способов сделать это - изменить класс элемента, чтобы изменить ваши css differennces. Если вы хотите добавить текст или дополнительные элементы. Посмотрите на функцию .append() в jQuery.

Однако, личное мнение здесь, AngularJS сделает такой материал очень простым. Если вы еще не изучили какие-либо рамки, я предлагаю вам взглянуть на него.

Answer 2

попробовать что-то вроде этого,

var toggleText = "toggle", 
 
    value; 
 
$('div').click(function() { 
 
    $(this).text(function(i, v) { 
 
    if (v == toggleText) 
 
     return value; 
 
    else { 
 
     value = v; 
 
     return toggleText; 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div>hi.....</div>

Answer 3

Вы можете использовать .data()

$(this).data('toggle', 0);   // initial data 
$('div').click(function() {   // on click 
    if($(this).data('toggle') === 0) { // if toggle is off 
    $(this).data('toggle', 1);  // turn toggle on 
    } else {       // if toggle on 
    $(this).data('toggle', 0);  // turn toggle off 
    } 
    $(this).append($(this).data('toggle')); 
}); 

Here's a JSFiddle