Question

在我正在制作的网站上，我放置了一个选择框，用户可以对页面上显示的项目列表进行排序。当他们选择一个页面时，页面正在提交，并且selectbox值会跳回到第一个默认值。现在我希望selectbox在提交后保留值。

我在XSLT工作，所以我不能使用PHP。这有Javascript功能吗？或者是一个jQuery插件/函数？

由于

我的表格：

<form name="sort-form" action="{$root}/resorts/" method="get">
    <select name="filter" onChange="document.getElementById('sort-form').submit();">
        <option value="">Sort By...</option>
        <option value="recommended">Recommended</option>
        <option value="location">Location</option>
        <option value="prices-from">Low budget</option>
        <option value="prices-till">High budget</option>
    </select>
</form>

Answer 1

您有两种选择：

通过AJAX提交表单。
将状态保存到Cookie。

我建议使用AJAX，因为它使界面更具交互性并节省互联网流量。要提交表单，您可以使用jQuery .post()方法：

<script type="text/javascript"> 
   $(document).ready(function(){ 
    $("#sort-form").submit(function(){ 
        $.post("/your/url.php", 
            $("#sort-form").serialize(), 
            function(data){ 
                // optional callback 
           } 
       ); 
    }); 
  });

如果这不是一个选项（例如，无论如何必须重新加载页面），您必须设置Cookies，然后在重新加载后再次检查它们。示例（使用here中的函数）：

// on submit 
setCookie("select_value", document.getElementById('yourSelectId').value);
....
// on load
var sortSelect = document.getElementById('yourSelectId');
var val = getCookie("select_value");
for(index = 0; index < sortSelect.length; index++) {
if(sortSelect[index].value == val)
  sortSelect.selectedIndex = index;
}

提交后保留选择框值

1 个答案: