jquery - ボタンの横のテキストを切り替える

Question

次のコードを使用して、各セルにボタンがあるテーブルがあります。

<span class = "button"><input id="button" type="button">

ボタンをクリックすると切り替わるテキストをその右側に表示したいと思います。だからそれはから行くだろう

[] 文章

[] その他のテキスト

ページをリロードせずに、他のセルのテキストを切り替えません。jQuery でこれを行うにはどうすればよいでしょうか (または、より良い方法がある場合は他の方法で)。

Answer 1

<span class="button">
    <span class="text">Text</span>
    <input id="button" type="button" />
</span>

JS:

$('.button input[type="button"]').on('click', function() {
    $(this).prev('.text').toggle();
});

Answer 2

私はあなたがこの後だと思います：

http://jsbin.com/azepex/1/edit

私はhtmlのこの構造に従いました：

<span class = "button">
    <input id="button" type="button" value='toggle text' >
    <span>text.</span>
</span>

これはjsです：

$(function(){
  $('.button input[type="button"]').toggle(function(){
    $(this).next('span').text('Other text.');
  }, function(){
    $(this).next('span').text('text.');
  }); 
});

上記のjsbinリンクをチェックアウトしてください

Answer 3

HTML

<span class="button">
    <input id="button" type="button" value="save">
    <span id="show-text">Text</span>
</span>​

JS

$("#button").toggle(function() {
    $("#show-text").text("Other Text").stop();
}, function() {
    $("#show-text").text("Text").stop();
});​