刷新页面后保留搜索值

时间:2014-05-01 15:26:57

标签: javascript php jquery

我有一个带有表单的HTML页面,该表单将值传递给外部PHP页面。

<form method="post" action="getContent.php">
    <input type="hidden" name="fromTest" id="fromTest"/>
    <input type="hidden" name="untilTest" id="untilTest"/>
    <input type="hidden" name="latTest" id="latTest"/>
    <input type="hidden" name="longTest" id="longTest"/>
    <input type="hidden" name="search1" id="search1"/>
    <input type="hidden" name="search2" id="search2"/>
    <input type="submit" class="sendAll" value="Gather News!">
</form>

代码的这一面工作正常,价值很高。我的问题是保留这些信息并在调用此页面后重新使用它并返回到我的html文件。

我想设置第一个搜索字词'#search1'来替换feed1mainheader中的值。

  <div id="feed1MainHeader"></div>

我理解这样做的方法,我已经通过这个网站使用了一些其他时间,但我的问题是在页面刷新时失去了价值?

   $('#feed1MainHeader').val($("#search2").val());

我已经阅读了一些关于cookie的内容,但我对此非常陌生,我不太了解如何为这种功能实现它们?

有什么想法吗?

2 个答案:

答案 0 :(得分:2)

浏览器本身无法为您保存值。但是你可以在这个问题上使用其他一些技巧。

autocomplete方法

在此方法中,您使用自动完成的输入字段属性。在哪个浏览器中将跟踪该特定字段中的每个输入数据。

以下是示例

<input type="text" autocomplete="on" name="somename" />

它第一次没有给你看任何东西。第二次它将显示提交的最后一个值,然后它将显示通过该字段提交的值列表。

localStorage方法

您可以将值存储在localStorage中(仅限支持HTML5的浏览器)。

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage

您可以将值存储在浏览器(客户端)设备中,然后使用JavaScript再次访问它。

缓存

您可以使用缓存服务以缓存的形式存储用户在浏览器中为您提供的数据和值。

JavaScript或服务器端语言可用于存储缓存文件。

这些是您可以实现的一些方法。自动完成方法是最容易和最简单的方法。但是,您也可以使用其他方法。他们会保存您的最后输入,并在您需要时为您提供。

祝你好运!

答案 1 :(得分:1)

尝试使用本地存储,例如:

localStorage.setItem("searchitem", $("#search2").val());

并在刷新检查时是否存在。如果它存在加载它