javascript更改切换按钮文本 [英] javascript change toggle button text

问题描述

我有这段代码用于语言切换：

I have this piece of code which i use for language toggling:

function toggleDiv(divid) {  
varon = divid + 'on';
varoff = divid + 'off';
      if(document.getElementById(varon).style.display == 'block'){
      document.getElementById(varon).style.display = 'none';
      document.getElementById(varoff).style.display = 'block';
      }
        else {  
            document.getElementById(varoff).style.display = 'none';
            document.getElementById(varon).style.display = 'block'
        }
} 

和HTML：

<div id="mydivon" style="display:block">some language text</div>
<div id="mydivoff" style="display:none">some other language text</div>
 <a href="#" onmousedown="toggleDiv('mydiv');">Language1/Language2</a>

我希望切换按钮可切换，当选择一个Language1时，切换切换文本到Language2反之亦然。一些指针会受到欢迎。 Thx

and i would like to make toggle button switchable, when one Language1 is selected, switch toggle text to Language2 and vice versa. Some pointers would be welcome. Thx

推荐答案

如评论中的OP所述：

目前你正在显示一个元素，但是切换本身并没有改变语言。

Currently you're displaying an element on wether it's selected but the toggle itself isn't changing language.

现在你可以做的就是当你mousedown并执行 toggleDiv（divid）
你应该有一个特殊的变量叫做这个

Now what you can do is when you mousedown and execute toggleDiv(divid) there should be a special variable to your disposal called this

这个基本上是以最简单的形式表示这叫我。
在您的情况下此是< a href =＃> Language1 / Language2< / a> link

this basically means "this called me" in the most simple form. In your case this is the <a href="#">Language1/Language2</a> link

那么你在函数中可以做什么：

So what you could do then within your function:

function toggleDiv(divId) {
    //also highly recommend you cache your variables
    varon = document.getElementById(divId + 'on');
    varoff = document.getElementById(divId + 'off');

    if (varon.style.display == 'block') {
        varon.style.display == 'none';
        varoff.style.display = 'block';
        this.innerHTML = varoff.innerHTML; // <- selected element value injected in bound button
    } else
        varon.style.display == 'block';
        varoff.style.display = 'none';
        this.innerHTML = varon.innerHTML; // <- selected element value injected in bound button
}

使用 this.innerHTML = varon / off.innerHTML 你说，调用我的元素必须具有块元素的值

With the line this.innerHTML = varon/off.innerHTML you're saying, "the element that called me has to have the value of the block element"

该值仍然默认为 Language1 / Language2 但是一旦你更改它就会更新。

The value will still default be Language1/Language2 but as soon as you change it it will update.

希望它有所帮助！

注意：未经测试

这篇关于javascript更改切换按钮文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！