0

以下是我用于展开和折叠 div 的代码。现在我想对代码做些小改动。当我展开 div 时，应该出现一个带有 div 内容的“[-]”，当我折叠一个带有 div 内容的“[+]”时。

<style type="text/css">
.gap
{

 border:1px solid black

}
</style>

<script type="text/javascript">

    function toggle_visibility(id) {
       var e =document.getElementById(id);

       if(e.style.display == 'none')
        {
          e.style.display = 'block';
          col.innerHTML=valu;
        }
       else
       {
          e.style.display = 'none';

       }
    }

    function edit(id,item)
    {
       var e = document.getElementById(id);
       var f = document.getElementById(item);

     document.getElementById('id4').innerHTML=e.innerHTML;     
      e.innerHTML=f.innerHTML;
      window.location=window.location;

    }
    function cancel(id,item)
    {

        document.getElementById(id).innerHTML=document.getElementById(item).innerHTML;
    }

</script>

<div class="gap" ><a href="#" onclick="toggle_visibility('id1');" id="x">[+]<div id="click" style="float:right;">Click here</div></a></div>

<div id="id1" style="display:none;">This is foo</div>


<a href="#" onclick="toggle_visibility('id2');" ><div class="gap">click here1</div></a>

<div id="id2" style="display:none;">click here1
<div> <a href="#"  onclick="edit('id2','id3');">Edit</a></div>
</div>




<div id="id3" style="display:none;">Edit
<div> <a href="#"  onclick="cancel('id2','id4')">cancel</a></div>
</div>


<div id="id4" style="display:none;"></div>

我正在等待您的帮助。

提前致谢

4

3 回答 3

1

这是你想要的吗？

function toggle_visibility(id) {
   var e =document.getElementById(id);
   var label = document.getElementById("x");

   if(e.style.display == 'none')
    {
      label.innerHTML = label.innerHTML.replace("[+]","[-]");
      e.style.display = 'block';
      col.innerHTML=valu;
    }
   else
   {
      label.innerHTML = label.innerHTML.replace("[-]","[+]");
      e.style.display = 'none';

   }
}
于 2013-06-24T04:43:04.830 回答
0

使用javascript的显示和隐藏功能来显示和隐藏div：

<div id="showHide" class="open" style="display: block;" onclick="showHide();">
    <!-- Your Contents -->
</div>

Javascript：

function showHide(currentElem) {
    if (currentElem.ClassName.indexOf('open') > -1) {
        // This means its open, now close it
        currentElem.className = 'closed';
        currentElem.style.display = 'none'; 
    } else {
        currentElem.className = 'open';
        currentElem.style.display = 'block';  
    }
}
于 2013-06-24T04:37:24.623 回答
0 
function toggle_visibility(id) {
    var e = document.getElementById(id);

    if (e.style.display == 'none') {
        document.getElementById('x').innerText = '[-]';
        e.style.display = 'block';
        //col.innerHTML = valu;
    }
    else {
        e.style.display = 'none';
        document.getElementById('x').innerText = '[+]';
    }
}

当您单击 div 上的 [+] 时，此代码显示 div 并将 [+] 更改为 [-]，反之亦然。如果您想将 [+] 更改为其他内容？像 '[+]click here' 你可以在代码中更改相应的字符串。我不明白“您也想更改内容......”是什么意思。你到底想改变什么？

于 2013-06-24T04:40:01.873 回答