1

I have the following javascript code:

window.toggle = function() {
 if( document.getElementById("calendar").style.display=='none' ){
     document.getElementById("calendar").style.display = '';
     $(".icon-chevron-down").removeClass("icon-chevron-down").addClass("icon-chevron-up");
     document.getElementById("label").innerText = "Hide calendar";
 } else {
     document.getElementById("calendar").style.display = 'none';
     $(".icon-chevron-up").removeClass("icon-chevron-up").addClass("icon-chevron-down");
     document.getElementById("label").innerText = "Show calendar";
 }
}  

I would like to change only a part of label, because I wouldn't like to remove bootstrap icons. Like here: http://jsfiddle.net/RkaQD/2/

Have you any hints how to cope with this disappering bootstrap icons?

Edit:

Maybe I write some example what I would like to have:

v 'show calendar'

^ 'hide calendar'

v 'show calendar'

^ 'hide calendar'

and so on...

4

2 回答 2

2

我认为它是innerHTML 而不是innerText。

于 2013-05-02T23:15:14.380 回答
1

您面临的问题是因为您正在更改带有 ID 标签的元素的内部文本......这个标签除了文本之外还有两个图标元素。

我所做的是将文本“隐藏日历”和“显示日历”放入带有 ID 的跨度中,然后更改跨度的内部文本(而不是标签)所以而不是:

<i class="icon-chevron-down"></i>
    Show calendar  
<i class="icon-calendar"></i>

你必须有

<i class="icon-chevron-down"></i>
    <span id="display_text">Show calendar</span>  
<i class="icon-calendar"></i>

并将 JavaScript 上的 2 行从

document.getElementById("label").innerText = "Hide calendar";
document.getElementById("label").innerText = "Show calendar";

document.getElementById("display_text").innerText = "Hide calendar";
document.getElementById("display_text").innerText = "Show calendar";

希望这有帮助。

于 2013-05-02T23:41:20.913 回答