JQuery Mobile Query String Проблема в не pushState браузерах - PullRequest
Новая
       11

JQuery Mobile Query String Проблема в не pushState браузерах

1 голос
/ 20 сентября 2011

Я пытаюсь извлечь переменную cid из строки запроса в JQuery Mobile beta 3.

Пример нормального URL будет /category.php?cid=23

Пример JQuery Mobile URL /#/category.php?cid=23

Я могу вытащить переменную из строки запроса, как правило, с помощью функции, приведенной ниже, в большинстве браузеров из-за переписывания URL JQuery Mobile Beta 3. Однако IE не поддерживает новые функции истории браузера. https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history

Поэтому мне нужен способ извлечь строку запроса из JQuery Mobile Url, показанную выше, и следующая функция, которую я обычно использую ниже, не работает для этого должным образом. 

function getQuerystring(key) {
   var re=new RegExp('(?:\\?|&)'+key+'=(.*?)(?=&|$)','gi');
   var r=[], m;
   while ((m=re.exec(document.location.search)) != null) r.push(m[1]);
   return r;
}

Я либо ищу альтернативное регулярное выражение, которое могло бы найти хеш-переменную в браузерах, которые не поддерживают history.pushState, либо какое-либо другое решение полностью. Я искал в документации решение этой проблемы, но ничего не нашел. Я бы подумал, что это будет проблемой, которая уже была бы продумана и решена мобильной командой JQuery, я, вероятно, просто упускаю что-то довольно очевидное. Заранее спасибо за любую помощь.

Ответы [ 2 ]

0 голосов
/ 21 сентября 2011

Хорошо, здесь есть функция, которая позаботится об обеих ситуациях, независимо от того, в каком браузере вы находитесь или даже каким образом вы используете JQuery Mobile.Этот код не идеален, я просто счастлив, что он работает в данный момент.Если и когда я обновлю функцию, я вернусь и обновлю ее здесь.

Сначала код проверяет, есть ли хеш.Если он есть, он ищет в нем строку запроса, как если бы это был URL.Если нет, он просто проверяет URL-адрес переменной.Этот код работает с проверкой конкретной переменной строки запроса, независимо от того, в каком состоянии она проверяется в JQuery Mobile.Во время создания страницы или в любом другом событии, погода JQuery Mobile Beta 3 перезаписала URL через pushstate или нет. 

function getQuerystring(name) {
    var hash = document.location.hash;
    var match = "";
    if (hash != undefined && hash != null && hash != '') {
        match = RegExp('[?&]' + name + '=([^&]*)').exec(hash);
    }
    else {
        match = RegExp('[?&]' + name + '=([^&]*)').exec(document.location.search);
    }
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
0 голосов
/ 21 сентября 2011

Рабочая демонстрация (я думаю)

Ссылка по теме:

JS 

$('#page2').live('pageshow', function(event, ui) {
    alert('Page 2 - CID: ' + getParameterByName('cid'));
});

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

HTML (добавление rel = "external" к ссылке) 

<div data-role="page" id="home">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">
                Home Page
            </li>
            <li>
                <!-- 
                    Pass Parm Here before the hash page 
                    and treating link as external 
                -->
                <a href="?cid=1234#page2" rel="external">Page 2</a>
            </li>
        </ul>                
    </div>
</div>
<!-- page 2 -->
<div data-role="page" id="page2">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">
                Page 2
            </li>
            <li>
                <a href="?cid=4321#home">Home Page</a>
            </li>
        </ul>
    </div>
</div>
...