JQuery переупорядочение <li>в соответствии с параметрами URL - PullRequest
Новая
       24

JQuery переупорядочение <li>в соответствии с параметрами URL

0 голосов
/ 22 марта 2012

Я хочу изменить свой список элементов в соответствии с параметрами в URL.

Вот мой список: 

<ul>
   <li><a href='page.php?paramValue=1'>iten1</a></li>
   <li><a href='page.php?paramValue=2'>iten2</a></li>
   <li><a href='page.php?paramValue=3'>iten3</a></li>
   <li><a href='page.php?paramValue=4'>iten4</a></li>

и если, например, URL-адрес его: mydomain.com / page.php? ParamValue = 3 список может изменить порядок, и 3-й li должен стать первым в списке после загрузки страницы ( При нажатии на любой iten страница загружается снова), например: 

<ul>
       <li><a href='page.php?paramValue=3'>iten3</a></li>
       <li><a href='page.php?paramValue=1'>iten1</a></li>
       <li><a href='page.php?paramValue=2'>iten2</a></li>           
       <li><a href='page.php?paramValue=4'>iten4</a></li>
   </ul>

Любые советы ??

Ответы [ 4 ]

1 голос
/ 22 марта 2012

Попробуйте код ниже. Не проверял, но должен работать. 

var ulElement = $("ul"); // this may change if you want a specific ul element.
var linkElems = window.location.href.replace(/.*\?/,"").split('&');
var paramValueStr = "";
for (var i=0; i < linkElems.length; i++) {
    if (linkElems[i].indexOf("paramValue") == 0) {
        paramValueStr  = linkElems[i];
    }
}
if (paramValueStr == "") {
    return;
}

var elemToRemove = ulElement.find('a [href*="' + paramValueStr + '"]').parent();
elemToRemove.remove(); // remove from original place
elemToRemove.prependTo(ulElement); // insert into beginning of ul
0 голосов
/ 22 марта 2012

Попробуйте:

Код ниже ищет href, который заканчивается 3, захватывает родительский (li) и добавляет его к ul. 

$('a[href$="3"]').parent().prependTo('ul');

Добавить более требовательные селекторы в зависимости от ситуации.

http://jsfiddle.net/iambriansreed/DDAvY/2/

Обновление:

Следующее немного более точно. Код ниже ищет href, который содержит paramValue=3 

$('a[href*="paramValue=3"]').parent().prependTo('ul');

http://jsfiddle.net/iambriansreed/DDAvY/4/

0 голосов
/ 22 марта 2012

попробуйте это:

javascript: 

elementID = /[0-9]+/.exec(/paramValue=[0-9]+/.exec(location.search));
$('li:nth-child('+elementID+')', 'ul#ulID').prependTo('ul#ulID');

Вы также можете сделать это: 

elementID = /[0-9]+/.exec(/paramValue=[0-9]+/.exec(location.search));
$('ul#ulID').prepend($('li:nth-child('+elementID+')', 'ul#ulID')
0 голосов
/ 22 марта 2012

Предполагая, что они всегда будут одинаковыми, вы можете использовать string.split (), чтобы получить число после значения: 

href = $(a).attr('href');
href.split()
//href is now an array[page.php?paramValue, number];
//you can use href[1] to sort the elements.

Если вы хотите продолжить JQUery, есть встроенный плагинпросто:

http://james.padolsey.com/javascript/sorting-elements-with-jquery/

Если вы используете этот плагин, ваш код будет выглядеть примерно так: 

$('li').sortElements(function(a, b){
    aHref = $(a).attr('href');
    bHref = $(b).attr('href');
    aHref = aHref.split();
    bHref = bHref.split();
    return aHref[1] > bHref[1] ? 1 : -1;
});

По общему признанию, это, вероятно, может быть сделано болеекрасиво, но должно работать

...