Изменение элементов Элементы

Я хотел бы изменить содержимое элемента нажатием кнопки, а затем вернуть его обратно к исходному сообщению. Как бы я сделал это предпочтительнее с помощью класса toggle, если это возможно.Изменение элементов Элементы

<doctype html> 
<html> 
<head> 
<meta charset=utf-8> 
<title>Day Practice</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"> </script> 

</head> 
<body> 
<h1> HotDogs</h1> 
<input type=button id=button value=button> 
<script> 
$("#button").click(function(){ 
$("h1").html("Change to this"); 
}); 


</script>

Это меняет заголовок с помощью кнопки, но я не знаю, как вернуть его, когда я нажимаю на кнопку еще раз. Может быть, Toggle Class, я не знаю.

источник

2015-10-02 Sam Opoku

это должно решить:

$("#button").toggle(function() { 
    $("h1").html("Change here"); 
}, function() { 
    $("h1").html("Revert back here"); 
});

источник

2015-10-02 22:59:13

не работал, когда я запустил страницу сразу, кнопка исчезла –

вы можете попробовать что-то еще мне нравится простота вашего кода, хотя, может быть, что-то другое –

@SamOpoku Почему вы принимаете ответ, который didn Ты работаешь для тебя? Я имею в виду, причина в том, что он не работает, потому что 'toggle()' устанавливает элемент видимым/невидимым, и поэтому это плохой ответ в любом случае, но все же .. – icecub

Установите флажок для переключения и проверки, и сохранить старый текст всякий раз, когда вы измените его. Пример:

var flag = false; 
var old_text = ""; 

$("#button").click(function() { 
    if (flag) { 
     $("h1").html(old_text); 
    } else { 
     old_text = $("h1").html(); 
     $("h1").html("Change to this"); 
    } 
    flag = !flag;  
});

источник

2015-10-02 22:59:07 enigma

Это сработало, но вы могли бы сделать упрощенная версия этого –

, насколько вы упрощены? Это довольно маленький блок кода. Я подумаю. – enigma

вы правы, неважно, его большой –

Вы можете попробовать это:

var alternate_text = "Change to this"; 
$("#button").click(function(){ 
    var temp = $("h1").html() 
    $("h1").html(alternate_text); 
    alternate_text = temp; // Switch the two instances of text. 
});

источник

2015-10-02 23:01:05 mbinette

Поскольку вы предпочли сделать это с toggleClass(), здесь вы идете:

$(document).ready(function(){ 

    var oldContent; 

    $("#button").click(function(){ 
     if($(".newCont")[0]){ 
      $("h1").html(oldContent); 
     } else { 
      oldContent = $("h1").html(); 
      $("h1").html("New text here"); 
     } 

     $("h1").toggleClass("newCont"); 
    }); 
});

источник

2015-10-02 23:10:00 icecub

ответ

Смежные вопросы