Question

我有一个＆＃34; a＆＃34;在我的代码中标记，点击后，它将切换元素的可见性。

HTML中的

我有：

<a href="#" onclick="toggle_visibility('foo');">Click here for details</a>
<div id="foo">
  <p>This is test</p>
</div>

另外，在我的Javascript中，我有：

function toggle_visibility(id) {
   var e = document.getElementById(id);
   e.value="New Button Text";
   if(e.style.visibility == 'visible')
      e.style.visibility = 'hidden';
   else
      e.style.visibility = 'visible';
}

这很好用（感谢stackoverflow人员）。

现在，我想要做的是，当我点击＆＃34;点击此处了解详细信息＆＃34;，我希望实际文本本身更改为＆＃34;关闭详细信息＆＃34;。< / p>

＆＃34;点击此处了解详情＆＃34; - ＆GT; ＆＃34;关闭细节＆＃34;

另外，我如何更改文本的颜色，因此当它更改为＆＃34;关闭详细信息＆＃34;它变成了红色＆＃34;。我该如何修改代码来执行此操作？

Answer 1

你可以这样做：

function toggle_visibility(el, id) {
    var e = document.getElementById(id);
    e.value = "New Button Text";
    if (e.style.visibility == 'visible')
        e.style.visibility = 'hidden';
    else
        e.style.visibility = 'visible';
    if (el.innerHTML == "Click here for details") {
        el.innerHTML = "Close the details";
        el.style.color = "red";
    }
    else {
        el.innerHTML = "Click here for details";
        el.style.color = null;
    }
}


<a href="#" onclick="toggle_visibility(this, 'foo');">Click here for details</a>

单击时HTML5更改描述文本

1 个答案: