【发布时间】：2014-03-26 11:46:59
【问题描述】：
我有一个页面（请参见图片了解说明），用户必须在其中选择几个选项。
这个想法是，您首先单击顶部框中的链接。然后在搜索框中输入一个字符串，它将显示 div1 中的相关链接。当您点击 div1 中的链接时，相关链接将显示在 div2 中。然后，点击 div2 中的链接后，您将在 div3 中获得结果。
我使用 ajax/javascript 为 div1 和 2 创建链接并获取 div3 的结果。 问题是，当我点击页面上的任何链接时，搜索框将被清除，即使下一步（例如显示下一个链接）将成功执行，div1、div2 和搜索框中的内容也会消失。
我可以做些什么来防止这种情况并保留搜索框 div1 和 div2 的内容？
我当前的 html 代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="img/favicon.png">
<script src="inc/OnlineLogs.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<title>Logs</title>
</head>
<body onload="getOnlineIds()">
<div class="main">
<div class="navigation">
<a href="?loc=bad">bad</a> •
<a href="?loc=erf">erf</a> •
<a href="?loc=ess">ess</a> •
<a href="?loc=ffb">ffb</a> •
<a href="?loc=goe">goe</a> •
<a href="?loc=hal">hal</a> •
<a href="?loc=ham">ham</a> •
<a href="?loc=jen">jen</a> •
<a href="?loc=koe">koe</a> •
<a href="?loc=lei">lei</a> •
<a href="?loc=mue">mue</a> •
<a href="?loc=rau">rau</a> •
<a href="?loc=wil">wil</a> •
<a href="?loc=wit">wit</a>
</div>
<div class="search">
Suche: <input type="text" id="input" onkeyup="getOnlineComms()">
</div>
<div class="onlines" id="onlinelist"></div>
<div class="ids" id="ids"></div>
<div class="log" id="log"></div>
</div>
</body>
</html>
也看看这个小提琴：http://jsfiddle.net/X7aXG/1/
编辑：我编辑了问题描述。点击任何链接都会删除 div1、div2 和搜索框的内容，即使会执行下一步。
【问题讨论】：
-
请提供有关使用的 javascript 方法的相关代码...加分项也是提供 jsFiddle
-
我试着把它弄好一点。 :)
-
如果您使用的是ajax，则不应清除搜索框（除非您在代码中明确清除它），您确定页面没有刷新吗？
-
@markpsmith 我不知道当我点击一个链接时它是否被称为“刷新”，该链接只是向 url 添加了一些参数，如顶部框中的链接......他们没有做除此之外的任何事情。
-
id="onlinelist" 和 id="ids" - 它们是 div1 和 div2 吗？在你的小提琴中，我可以看到 ids = msg;和 idlist.innerHTML="";关于 ajax 成功回调 - 这是在删除内容吗？
标签： javascript jquery html ajax