Javascript 切换按钮标签上的文本

我有一个显示隐藏表行功能，但现在想更改我的文本

<script language="javascript" type="text/javascript">

function HideStuff(thisname) {
    tr = document.getElementsByTagName('tr');        
    for (i = 0; i < tr.length; i++) {
        if (tr[i].getAttribute('classname') == 'display:none;') {
            if (tr[i].style.display == 'none' || tr[i].style.display=='block' )  {
                tr[i].style.display = ''; 
            }
            else {
                tr[i].style.display = 'block'; 
            }
        }
    }
}

函数HideStuff（此名称）{
tr=document.getElementsByTagName（'tr'）；
对于（i=0；i

html如下所示

<button id="ShowHide" onclick="HideStuff('hide');>Show/Hide</button>

---

使用jQuery类似的方法可能会奏效：

$('ShowHide').click(function(){
    if ( $('hide').css('display') == 'block' )
        $('ShowHide').val("Hide");
    else
        $('ShowHide').val("Show");
});

我只是从我的头顶写下了，所以你可能需要做一些改变，你可以阅读更多关于这个项目的信息。我所做的只是使用匿名函数，不知道为什么要将这个名称传递到JS中，因为它目前还没有被使用

如果您将呼叫更改为：

<button id="ShowHide" onclick="HideStuff(this)">Show</button>

我建议使用jquery，但您可以只使用javascript的
document.getElementById
方法

在你的职能中：

function HideStuff(thisname) {
    tr = document.getElementsByTagName('tr');
    for (i = 0; i < tr.length; i++) {
        if (tr[i].getAttribute('classname') == 'display:none;') {
            if (tr[i].style.display == 'none' || tr[i].style.display == 'block') {
                tr[i].style.display = 'none';

            }
            else {
                tr[i].style.display = 'block';

            }
        }
    }
    if (document.getElementById("ShowHide").value == "show") {
        document.getElementById("ShowHide").value = "hide";
    }
    else {
        document.getElementById("ShowHide").value = "show";
    }

}

函数HideStuff（thisname）{
tr=document.getElementsByTagName（'tr'）；
对于（i=0；i

尽管如此，我可能会在函数调用中传入
this
，而不是文本“hide”。然后你就可以像zaph0d说的那样做了。那就干净一点了

$('#HideShow').click(function() 
{ 
  if ($(this).text() == "Show") 
  { 
     $(this).text("Hide"); 
  } 
  else 
  { 
     $(this).text("Show"); 
  }; 
});

或者，.toggle（）有一个.toggle（偶数、奇数）；功能，对您来说最有意义的使用，一个是稍微短一点的代码，但可能不够明确

$('#HideShow').toggle(function()  
  {  
   $(this).text("Hide");  
     HideClick('hide');
  },  
  function()  
  {  
     $(this).text("Show"); 
     HideClick('hide'); 
  }  
);  

注意：您可以根据需要在函数（）中包含任何其他操作，并且可以通过在其中调用HideClick（）函数调用来消除标记/html中的onclick。正如我在第二个例子中演示的那样

作为后续工作，并提供一个替代方案，您可以将CSS类添加到CSS中

.hideStuff
{
display:none;
}

然后将其添加到：

.toggle('.hideStuff');

或者，更直接地说：在适当的地方

.addClass('.hideStuff');
.removeClass('.hideStuff');

他在问如何更改按钮标签内的文本。那么更改我的答案有多难？我只是看错了。对不起，我没想到给你编辑。不管怎样，否决票被收回了。
.addClass('.hideStuff');
.removeClass('.hideStuff');