Заполните значение атрибута на основе переменной в строке URL - PullRequest
1 голос
/ 26 декабря 2011

Допустим, я нахожусь на странице моего сайта: http://www.example.com/SearchResults.asp?Search=stackoverflow. Можно ли использовать код JavaScript или jQuery, чтобы получить переменную "search" из строки URL-адреса и заполнить ее значением окно поиска?

По сути, у меня будет обычное поле поиска:

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

И пользователь будет что-то искать, но мне нужен код JavaScript или jQuery, который получит значение из переменной «search» в строке URL, когда клиент находится на странице Search.asp, и добавит его в «значение» в input#search.

Таким образом, пользователь будет на этой странице: http://www.example.com/SearchResults.asp?Search=stackoverflow, и окно поиска будет выглядеть так:

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

Спасибо

Ответы [ 3 ]

2 голосов
/ 26 декабря 2011

Вы можете попробовать эту функцию:

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, который выглядит следующим образом:

<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>

Надеюсь, это поможет!

1 голос
/ 26 декабря 2011

Вы можете использовать плагин JQuery URI (бессовестно написанный вами по-настоящему) для извлечения любого фрагмента URL: в частности, $.uri(window.location.href).at("query").search возвращает «stackoverflow» для указанного URL.* Общий процесс заключается в регистрации обратного вызова (запускаемого при загрузке страницы) для анализа URL-адреса и установки значения этого элемента формы, а именно:

<script>
  $(document).ready(function () {  
    $('#Search').val($.uri(window.location.href).at("query").search); 
  })
</script>
0 голосов
/ 26 декабря 2011

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 не был найден.

...