Question

我用div中的ajax调用一个页面。当页面打开时，有一个“关闭”按钮来隐藏div。单击关闭按钮后，我需要刷新页面以重新打开div。如果不刷新页面，我该怎么做才能打开和关闭div？

代码：

<script>
$(document).ready(function(){   

$('#close').click(function() {
  $('#show_options').hide();
  $(window).unload( function () { alert("Bye now!"); } );
});


});

</script>

 <a href="#" id="close">Close</a> <div id="show_options" style="position:absolute;     width:500px; padding:10px; left: 246px; top: 41px; z-index:900;"></div>My selection: <span     id="select-result" style="font-family:Arial, Helvetica, sans-serif;font-    size:10pt;color:#444;">leeg</span> </div>



<a ONClick="xmlhttpPost('selected_output_team.php', 'options', 'show_options'); return         false; " id="show_options"> edit</a>

Answer 1

我没有对此进行测试，但在“近距离”锚点上，试试这个：

<a href="#" id="close" onclick="closeDiv();">Close</a>
... stuff ...
<a href="#" id="open" onclick="openDiv();">Open</a>

一旦你有了这个，你可以，而不是删除div，只需删除（并读取）其内容：

function closeDiv()
{
    document.getElementById("show_options").innerHTML = "";
}
function openDiv()
{
    document.getElementById("show_options").innerHTML = "...whatever...";
}

当然还有其他方法，但这是其中之一。请注意，我还没有测试过代码。

Answer 2

使用toggle（）而不是hide（）或show（）

Answer 3

我不是专家，但如果您不想隐藏或显示带动画的div标签，您只需使用CSS更改div标签的可见性即可。您可以使用以下功能关闭并打开div标签：

function close() {
    document.getElementById("show_options").style.display = "none";
}
function open() {
    document.getElementById("show_options").style.display = "block";
}

CSS的好处在于您不必重新生成内容，因此我认为它应该更快，代码可以更短。

Answer 4

我不确定我理解你的问题。但是，如果您只是希望close-link执行javascript函数，而不是其他任何内容，请将“＃”替换为“javascript：;”在链接标签中。锚有时会给你一些意想不到的行为。

ajax：如何在使用ajax关闭后重新打开div

4 个答案: