Question

我有一个表格，每个单元格中都有一个按钮，代码如下：

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

我想在其右侧显示一些文本，当单击该按钮时，该文本将切换。所以它会来自

[]文字

[] OtherText

无需重新加载页面，也不会切换其他单元格中的文本。我如何使用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();
});

切换按钮旁边的文字

3 个答案: