Правильный способ обработки глубоких ссылок с помощью адреса jQuery - PullRequest
Новая
       45

Правильный способ обработки глубоких ссылок с помощью адреса jQuery

3 голосов
/ 25 апреля 2011

Я использую jQuery Address для обработки глубоких ссылок с моим приложением AJAX. Мои URL-адреса имеют формат: example.com/#/section/item/param/param/param... Я настроил его с помощью прослушивателя .change() для обработки различных частей URL-адреса. Так что /project/my-project/view-item/2/compose откроет окно создания под этим проектом и этим элементом. Проблема в том, что всякий раз, когда URL-адрес изменяется на это, вызывается каждое действие до этого момента. (Действия, которые происходят, когда URL просто /project/my-project вызывают и т. Д.)

Каков наилучший способ справиться только с тем действием, которое я хочу, не «поднимаясь по цепочке»?

Ответы [ 3 ]

1 голос
/ 06 мая 2011

Переменная события передается в функцию change со свойствами: value, path, pathNames, parameterNames, parameters, queryString.Свойство, которое вы хотите отслеживать: pathNames.

Вот несколько отрывков, которые я собрал, которые могут помочь вам отследить, насколько вы глубоки, а также что именно изменилось: 

var $current_path = window.location.hash;
$.address.change( function(event) {

   // get the difference in the two paths
   $changed_path = event.path.replace(new RegExp('^'+$current_path,'i'), '');

   // make sure we update the current path
   $current_path = event.path;

   // how deep is the new path?
   $level = event.pathNames.length;

   // break the changed part into segments, ignoring leading/trailing slashes
   $changed_path_array = $changed_path.replace(/^\/|\/$/g, '').split('/');

   // let's see what level actually changed from the current path
   $changed_level = $level - $changed_path_array.length;

} );

Затем вы можете организовать оставшуюся часть своей функции, используя новую глубину в сочетании с массивом сегментов, чтобы точно определить, что нужно обновить.Основываясь на $ current_path, вы можете выполнить новую загрузку страницы или просто внести небольшие изменения где-то на странице.

0 голосов
/ 07 мая 2011

Похоже, что для расширенной маршрутизации на стороне клиента может быть полезно использовать что-то более встроенное, например, PathJS . Он очень прост в использовании и позволит вам сделать что-то гораздо более простое и элегантное, например: 

// Define a route
Path.map("#/project/my-project/view-item/:id/compose").to(function(){
    var id = this.params["id"]; //get your ID
    $("#panel_" + id).show(); // Do something with the id.
});

// Start listening for changes
Path.listen():
0 голосов
/ 06 мая 2011

Вам нужно будет отслеживать «текущий» URL / состояние программы и сравнивать его с тем, что вы получаете в change(), чтобы выяснить, какие действия необходимо выполнить дальше.

...