Question

假设我在我网站的某个页面上：http://www.example.com/SearchResults.asp?Search=stackoverflow。是否可以使用JavaScript或jQuery代码从URL字符串中获取变量“search”并将其填充到搜索框的值中？

基本上我会有我常规识别的搜索框：

<input type="text" title="Search" id="search_box" />

用户将搜索某些内容，但我需要一个JavaScript或jQuery代码，当客户在Search.asp页面上时，它将从URL字符串中的“search”变量中获取值，并将其添加为“值”到input#search。

因此，用户将出现在此页面上：http://www.example.com/SearchResults.asp?Search=stackoverflow，搜索框将如下所示：

<input type="text" title="Search" id="search_box" value="stackoverflow" />

由于

Answer 1

您可以尝试此功能：

function getSearchVariable(variable) 
{
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i=0;i<vars.length;i++) {
        var pair = vars[i].split("=");
        if(pair[0] == variable){
            return unescape(pair[1]);
        }else{
            return false;
        }
    }
}

如果上面提到的示例中存在此函数，则所有调用getSearchVariable（“Search”）都会返回“stackoverflow”。

因此，在您的页面中，您将拥有一个类似于以下内容的脚本元素：

<script type="text/javascript">
    function getSearchVariable(variable) 
    {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i=0;i<vars.length;i++) {
            var pair = vars[i].split("=");
            if(pair[0] == variable){
                return unescape(pair[1]).split("+").join(" ");
            }else{
                return "";
            }
        }
    }

    $(document).ready(function(){
        $("#search_box").val(getSearchVariable("Search"));
    });
</script>

希望有所帮助！

Answer 2

您可以使用JQuery URI plugin（由您真实无耻地编写）来提取URL的任何部分：具体而言，$.uri(window.location.href).at("query").search会为所述URL产生“stackoverflow”。

总体流程是注册一个回调（在页面加载时触发）来分析URL并设置该表单元素的值，即：

<script>
  $(document).ready(function () {  
    $('#Search').val($.uri(window.location.href).at("query").search); 
  })
</script>

Answer 3

的JavaScript

document.getElementById('Search').value = [(window.location.search.match(/(?:^|[&;])Search=([^&;]+)/) || [])[1]];

jsFiddle

用[]包装它意味着如果找不到该值，它将返回一个空字符串而不是undefined（将设置为输入的value并显示为undefined字符串）。

的jQuery

$('#Search').val(function() {
    return (window.location.search.match(/(?:^|[&;])Search=([^&;]+)/) || [])[1];
});

jsFiddle

(/* get GET param */ || [])如果找不到GET参数，代码就不会出错。

根据URL字符串中的变量填充属性值

3 个答案:

的JavaScript

的jQuery