我正在使用 javascript 代码展开和折叠我的 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';
else
e.style.display = 'none';
}
function edit(id,item)
{
var e = document.getElementById(id);
var f = document.getElementById(item)
e.innerHTML=f.innerHTML;
}
</script>
<a href="#" onclick="toggle_visibility('id1');" ><div class="gap">Click here to toggle visibility of element #foo</div></a>
<div id="id1" style="display:none;">This is foo</div>
<a href="#" onclick="toggle_visibility('id2');" ><div class="gap">Click here to see wonder</div></a>
<div id="id2" style="display:none;">Tsdgdfsehd
<div> <a href="#" onclick="edit('id2','id3');">Edit</a></div>
</div>
<div id="id3" style="display:none;">Edit
<div> <a href="#" onclick="edit('id3','id2');">cancel</a></div>
</div>
我面临的问题是..当我单击第二个 div 时,它正在展开并且我在第二个 div 中提供了一个编辑选项..然后单击编辑它覆盖第二个 div 元素并显示第三个 div元素。 同样,在第 3 个 div 中,我给出了取消编辑部分并显示第 2 个 div 内容的链接..但它没有显示..
我正在等待帮助..
提前致谢
最佳答案
使用
location.reload();
在取消点击时使用以下函数
function cancel(){
location.reload();
}
<a href="#" onclick="cancel()">cancel</a>
使用以下代码重新加载 div 2
function edit(id,item)
{
var e = document.getElementById(id);
var f = document.getElementById(item);
// Add this line additional
document.getElementById('id4').innerHTML=e.innerHTML;
e.innerHTML=f.innerHTML;
}
function cancel(){
document.getElementById('id2').innerHTML=document.getElementById('id4').innerHTML;
}
<a href="#" onclick="cancel()">cancel</a>
同时添加这个隐藏的div
<div id="id4" style="display:none;"></div>
关于单击取消按钮时返回同一页面的 Javascript 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17160800/