Question

我使用ajax进行分页，所以Sammy.js是不错的选择。但我也使用了可以过滤结果的复选框。这对Sammy来说没问题：我必须定义Sammy将拦截的路线。问题是：如果没有选中，但我不想在URL上显示一些过滤器（参数），但Sammy不支持可选参数。

    var samm = $.sammy(function () {

        this.defaultCheckFormSubmission = this._checkFormSubmission;
        this._checkFormSubmission = function (form) {
            var $form, path, verb;
            $form = $(form);
            path = $form.attr("action");
            verb = this._getFormVerb($form);
            var index = path.indexOf("#");
            if (verb === "get" && path.indexOf("#") == -1) {
                return true;
            }
            else {
                return this.defaultCheckFormSubmission(form);
            }
        };
        this.get('#/Page=:page', function (context) {

            alert("sammy");
        });
    });
    samm.run('#');

我不希望我的所有网址看起来像www.something.com＃/ Page = 5％Filter1 = 0？Filter2 = 0？Filter3 = 0？Filter4 = 1 ......... ..

Answer 1

如果您不希望Sammy处理额外的过滤器（例如未选中的复选框值），请不要将它们放入您的路线中。而只是通过jquery从控件中获取参数并执行类似的ajax请求。所以像这样：

this.get('#/Page=:page', function (context) {
        var page = this.params['page'];
        var filter1 = $("#chkFilter1").is(':checked');
        var filter2 = $("#chkFilter2").is(':checked');
        var filter3 = $("#chkFilter3").is(':checked');
        //etc..
        //do work here
    });

如果您需要为深层链接或Google跟踪设置不同的网址，并且您知道所需的最大变量数，那么您可以根据您拥有的变量数量计划路线。您必须首先放置大多数变量，否则Sammy将错误地匹配URL。这就是如何使URL仅显示已检查的值，但仍然通过JQuery获取未经检查的值：

   this.get('#/Page=:page%filter1=:filter1?filter2=:filter2?filter3=:filter3', function (context) {
        var page = this.params['page'];
        var filter1 = this.params['filter1'];
        var filter2 = this.params['filter2'];
        var filter3 = this.params['filter3'];
    });
    this.get('#/Page=:page%filter1=:filter1?filter2=:filter', function (context) {
        var page = this.params['page'];
        var filter1 = this.params['filter1'];
        var filter2 = this.params['filter2'];
        var filter3 = $("#chkFilter1").is(':checked');
    });
    this.get('#/Page=:page%filter1=:filter1', function (context) {
        var page = this.params['page'];
        var filter1 = this.params['filter1'];
        var filter2 = $("#chkFilter1").is(':checked');
        var filter3 = $("#chkFilter2").is(':checked');
    });

另一个选择是抛弃查询字符串变量，只使用像www.something.com＃/ 5/0 / 1/0/1这样的URL结构。看起来像这样：

   this.get('#/:page/:filter1/:filter2/:filter3/:filter4', function (context) {
        var page = this.params['page'];
        var filter1 = this.params['filter1'];
        var filter2 = this.params['filter2'];
        var filter3 = this.params['filter3'];
        var filter4 = this.params['filter4'];
    });

说完所有这些选项之后，如果你有一个未知的可能变量，你就必须做一些更动态的事情，这里有解释：sammyjs optional parameters

Sammy js可选参数

1 个答案: