Question

我想为用户提供一个“高级搜索”页面，可以使用复选框打开或关闭。我创建了一个div，它在页面的其余部分分层，并使用了这样的复选框：

style.display = "none"
style.display = "block"

这很好用，因为我想要的基本上是一个模态对话框，对我来说很有意义。

我添加了一个“重置”按钮，该按钮应清除所有字段，然后再次显示“高级搜索”页面。我不知道如何完成这一切。我有两个想法，但都没有工作：

重置搜索字词的会话变量，然后以某种方式告诉刷新页面以打开复选框。
使用专用的“高级搜索”页面，而不是显示或隐藏div。此页面是带有参数？search = true的根URL。该复选框在带有和不带参数的URL之间切换。似乎更容易控制。

我尝试将此类代码用于解决方案＃2的尝试没有奏效：

function ModalPage() {
    if( self.location == location ) 
         { self.location = "?search=true"; }
    else { self.location = location; }
    // (some attempts looked less silly than this...)of #2
}

您的解决方案？

Answer 1

如何在会话中存储该选项，然后再次加载页面。在页面加载时，您可以检查该会话变量，如果设置，则选中复选标记。

Answer 2

您的意思是说您有一个简单的“搜索页面”和“高级搜索”页面吗？或者您只有一个页面，在复选框单击后显示和隐藏高级搜索功能？

在第二种情况下，您可以添加一个名为“reset”的新javascript函数，并将该函数与重置按钮相关联：

<input type="button" id="resetButton" onclick="reset();" value="Reset"/>

在新的javascript“重置”功能中，您可以执行以下两项操作：重置所有字段，并显示高级搜索组件

function reset() {
    //reset all the fields
    ....

    document.getElementById(YOUR_ADVANCED_SEARCH_ID).style.display = "block";
}

在第一种情况下，重置功能可以简单地重定向到高级搜索页面，例如

location.href = "advancedSearchPage.XXX";

复选框切换页面视图

2 个答案: