启用后退按钮作为“撤消”按钮； Ajax 应用程序中的按钮
我在尝试使用浏览器的“后退”和“前进”按钮时遇到 Ajax 应用程序问题。我正在使用 jQuery History 插件来启用浏览器历史记录。
该应用程序由一个产品页面组成。有一个排序栏，使用户能够按各种值对产品进行排序。用户可以选择产品服装类别（连衣裙、上衣、下装、裙子等）、子类别部门（裙子：迷你裙、长裙、高腰裙、波西米亚风/嬉皮士等）、尺码（XS SML XL XXL） XXXL）、颜色（白、黑、灰、蓝、红等）、时代和材料。
大多数选项是通过使用 Ajax 将最新选择的选项加载到适当的 DIV 中来启用的。
例如，要选择黑色，将执行以下代码
$('#colorSort').load('colorSort.php?color=Black');
然后如果用户选择棕色：
$('#colorSort').load('colorSort.php?color=Brown');
然后如果用户取消选择黑色：
$('#colorSort').load('colorSort.php?colorRemove=Black');
只要我们不需要支持后退/前进按钮，这就可以正常工作，但是当通过 jQuery History 添加后退按钮功能时，我们遇到了问题。例如：使用我们之前的示例，用户选择了黑色和棕色。现在假设用户单击后退按钮。用户希望删除他们的棕色颜色选择，但事实并非如此，因为正在加载的 URL 是：
colorSort.php?color=Black,
而不是
colorSort.php?colorRemove=Brown
它需要的样子。
我尝试通过向查询字符串附加一组“撤消”参数来解决此问题。例如，
colorSort.php?color=Brown//colorRemove=Brown
在双斜杠之前包含当前查询字符串，在斜杠之后包含“后”查询字符串。因此，使用此代码，如果我知道单击了新链接，则可以加载当前查询字符串（斜杠之前），如果我知道单击了后退按钮，则可以加载斜杠后面的“后退”查询字符串。
但问题是，似乎没有任何方法可以检测是否单击了后退/前进按钮。 jQuery History 在 hashchange 事件下运行，并且该事件对于触发它的事件没有区别（据我所知）。
这是我的问题。如果 StackOverflow.com 的超级聪明人能够帮助我找到解决方案，我将不胜感激。谢谢你！
I have a problem with an Ajax app that I'm trying to get working with the browser's Back and Forward buttons. I am using the jQuery History plugin to enable the browser history.
The app consists of a page of products. There is a sort bar that enables the user to sort products by various values. The user may select a product clothing category (dresses, tops, bottoms, skirts, etc), a sub-category department (skirt: mini, maxi, high-waisted, boho/hippy, etc), a size (XS S M L XL XXL XXXL), a color (white, black, gray, blue, red, etc), and an era and materials.
Most options are enabled by using Ajax to load the latest selected option into the appropriate DIV.
So for instance, to select the color Black, the following code would be executed
$('#colorSort').load('colorSort.php?color=Black');
Then if the user selects Brown:
$('#colorSort').load('colorSort.php?color=Brown');
Then if the user de-selects Black:
$('#colorSort').load('colorSort.php?colorRemove=Black');
This works fine so long as we don't need to support the back/forward buttons, but when add back button capability via jQuery History we run into problems. For example: using our previous example, the user selected the colors black and brown. Now let's say the user clicks the back button. The user would expect their Brown color choice to be removed, but that isn't the case, because the URL being loaded is:
colorSort.php?color=Black,
and not
colorSort.php?colorRemove=Brown
which is what it needs to be.
I tried working-around this problem by appending a set of 'undo' params to the query string. So for instance,
colorSort.php?color=Brown//colorRemove=Brown
contains the current query string before the double slashes and the 'back' query string after the slashes. So using this code, if I knew a new link had been clicked, I could load the current query string (before the slashes) and if I knew the back button had been clicked, I could load the 'back' query string following the slashes.
But the problem is that there does not appear to be any way to detect whether the Back/Forward buttons were clicked. jQuery History operates under the hashchange event, and that event makes no distinction (as far as I know) as to what event fired it.
This is my problem. I would be very grateful if the super-smart folks of StackOverflow.com could help me find a solution. Thank you!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
查看jquery bbq（后退按钮和查询）。它允许您通过使用浏览器的标准历史记录实现来存储状态来准确地实现您想要的目的。然后，它使用 hashChange 事件（如果支持，则使用一些技巧）在感兴趣的事情发生时触发操作（即单击链接或单击后退按钮）
这样您就可以单击链接，它将添加新的哈希参数到您的页面上，您可以获取该参数的任何内容并相应地加载数据。当您回击时，它会获取参数的先前值，然后像以前一样加载，并在可能的情况下进行缓存。这是一种简单化的解释，并不完全正确，但足以进行简要概述。
check out jquery bbq (Back Button & Query). It allows you to achieve exactly what you want by storing state using the browser's standard history implementation. It then uses the hashChange event (when supported and some trickery when not) to trigger actions when things of interest happen (ie. clicking on a link or clicking back button)
This way you can click a link, it will add a new hash param onto your page, you can fetch whatever that param is and load the data accordingly. When you hit back, it gets the previous value of the param, and you load as you did before, caching where possible. That's kind of a simplistic, not exactly true explanation, but close enough for a brief overview.
添加隐藏字段来存储颜色值。
第一次更改颜色时，将值添加到隐藏表单字段中。
每次检查更改颜色的条件
如果您按后退按钮并返回，则
如果隐藏字段有值，则使该隐藏字段中的颜色
在本例中为棕色，
否则如果隐藏字段为空，则默认颜色为黑色。
我希望这会起作用。
由于页面未提交，会话无法使用。
Add a hidden field to store color value .
first time when you change the color , add a value into a hidden form filed.
check a condition for changing color each time
if you press back button and came back
if hidden field have value make the color what is in that hidden field
in this case brown
otherwise if hidden field is empty default color black.
I hope this will work.
As the page is not submitting session cannot use.