добавить параметр url, если существует, или добавить, если не существует jQuery - PullRequest
0 голосов
/ 16 февраля 2020

Я создаю фильтр на основе размера, цвета и т. Д. c. Так что можно выбрать несколько предметов. Когда я нажимаю на каждый элемент, он должен добавляться к текущему URL. Пожалуйста, проверьте ниже URL,

If parameter not exists in URL

http://example.com/category-3?tracker=Q2F0ZWdvcnkgMw&color=White

If parameter exists and selected same color

http://example.com/category-3?tracker=Q2F0ZWdvcnkgMw&color=White

If parameter exists and selected multiple colors

http://example.com/category-3?tracker=Q2F0ZWdvcnkgMw&color=White-Black

Как реализовать то же самое, используя jQuery. Я попытался использовать приведенный ниже код,

function setGetParameter(paramName, paramValue) {
    var url = window.location.href;
    var hash = location.hash;
    url = url.replace(hash, '');
    if (url.indexOf(paramName + "=") >= 0) {
        var prefix = url.substring(0, url.indexOf(paramName + "="));
        var suffix = url.substring(url.indexOf(paramName + "="));
        suffix = suffix.substring(suffix.indexOf("=") + 1);
        suffix = (suffix.indexOf("&") >= 0) ? suffix.substring(suffix.indexOf("&")) : "";
        url = prefix + paramName + "=" + paramValue + suffix + "-";
    } else {
        if (url.indexOf("?") < 0)
            url += "?" + paramName + "=" + paramValue + "-";
        else
            url += "&" + paramName + "=" + paramValue + "-";
    }
    window.location.href = url + hash;
}

Приведенный выше код работает с одним значением параметра. Для нескольких значений, как изменить вышеуказанный код.

1 Ответ

1 голос
/ 16 февраля 2020

Я рекомендую вообще не использовать этот код для создания URL.
Используйте что-то вроде https://medialize.github.io/URI.js/, в котором есть плагин jQuery.
Почему?
Ваш Параметры запроса здесь не закодированы, поэтому он может «сломать» URL. Использование библиотеки, такой как URI. js, с компоновщиком для добавления параметров запроса поможет решить ваши проблемы. Парсинг и создание URL-адресов не так просты, как может показаться, поэтому лучше полагаться на проверенный код.

var url = URI(window.location.href); // no need to remove and add the hash back anymore
var queryMap = url.query(true);
if (queryMap[paramName]) {
    // param already exists
    var values = queryMap[paramName].split('-');
    if (!values.includes(paramValue)) {
        // paramValue not found: add it
        values.push(paramValue);
        url.setQuery(paramName, values.join('-'));
    }
} else {
    // param does not exist yet
    url.setQuery(paramName, paramValue);
}

window.location.href = url.toString();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...