javascript - 在变量索引处插入字符串

Question

我一直无法找到一个有效的例子或一个很好的解释来说明我如何实现以下目标:(如果有人能指出我正确的方向，我将不胜感激。

我有一个查询字符串:**"/api/bla?sources=[1,2]&plans=[1,2]&codes=[1,2,3]"**

当我的页面上发生某些事件时，我将通过 javascript 或 jquery 更新查询字符串，这无关紧要。

例如，页面上有一个多选下拉菜单，其中包含 [sources] 和 [plans] 以及 [codes]。 .. 这些下拉菜单有 ID，我要更新我的请求 url，并在下拉菜单中选择项目。

当从下拉列表(或复选框，无论使用什么页面控件)中选择 ID 为“3”的来源时，查询字符串参数 sources[1,2] 将需要附加“3”。同样，如果未选择 ID 为“2”的项目，它同样会从查询字符串中删除，将新字符串保留为 sources[1,3]

我对 javascript/jquery 有点陌生，尤其是更高级的字符串操作。我一直在尝试重新创建一些东西来证明这一点，但得到了以下没有完全发挥作用的东西。

基本上我的初始 if 语句按预期工作，但是当 else 被击中时(当另一个 ID 需要添加到查询字符串中的现有模型时 - 例如 [sources 的第二个 ID ] 或 [codes]) 它返回不稳定的输出 - 因为我无法获得正确的公式来正确更新所有内容。

//TIMEMTABLE QUERY
function updateCalendar(filter_id, filter_element) {
    //Run through the filter checks before making final call to query and update timetable?

    //GET THE MODEL/OBJECT NAME
    var queryName = filter_element.attr('data-owner');


    //GET THE IDs //this is either an array of all selected IDs or a single id which is used in the else statement
    var queryId = filter_element.attr('value');
    var queryIds = $('#'+filter_id).val();


    var modelCheckIndex = requestString.toLowerCase().indexOf(queryName.toLowerCase());
    //build a request string
    if (modelCheckIndex < 0) {
        console.info('ADD MODEL TO QUERY STRING');
        requestString = requestString + "&" + (queryName.toLowerCase() + "[" + queryIds + "]");
        console.log(requestString);
    }
    else{
        console.info('UPDATE MODEL ON QUERY STRING');
        var position = requestString.toLowerCase().indexOf(queryName.toLowerCase());
        //requestString = requestString.substr(modelCheckIndex -1, requestString.length -1) + "," + queryId + "]";
        requestString = requestString.slice(modelCheckIndex.indexOf("]"), modelCheckIndex) + "," + queryId;
        console.log(requestString);

    }

//MAKE THE API CALL USING CREATED QUERY STRING

}

如果有人有任何例子或 fiddle ，我也会很感激。 Fiddle我正努力去上类

Answer 1

看起来您只是在解析和更新查询字符串时遇到了问题。在这种情况下，我有一个我一直在使用的函数 ( thank you Google )

function getUriParams(string) {
    var params = {},
    queryString = string.slice(string.lastIndexOf('?')).substring(1),
    regex = /([^&=]+)=([^&]*)/g,
    m;
    while (m = regex.exec(queryString)) {
        params[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
    }
    return params;
}

输入是您的requestString，输出是查询字符串的键值对对象。

为了使对象成为字符串，jQuery 使用 $.param() 使它变得简单.

//get key value pairs
var obj = getUriParams(requestString);

//make query string
var str = $.param(obj);