Есть ли способ нацелить элемент на основе ближайшего атрибута, который содержит целое число? - PullRequest
Новая
       13

Есть ли способ нацелить элемент на основе ближайшего атрибута, который содержит целое число?

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

Вот основная идея того, чего я пытаюсь достичь, у меня есть список ... 

<ul>
<li position="400">Item 1</li>
<li position="510">Item 2</li>
<li position="590">Item 3</li>
<li position="614">Item 4</li>
</ul>

И что я хотел бы сделать, это выбрать ближайший элемент на основе числа.

Если бы наше случайное число было 490, оно добавило бы класс "selected" в список Item 2.

Но я не знаю, как это сделать, или если это вообще возможно ...Я делаю это для целей навигации, поэтому ... 

var position = $(window).scrollTop();

, затем при нажатии клавиши выберите элемент списка с атрибутом позиции, ближайшим к переменной "position".Имею ли я смысл?

Если бы кто-нибудь мог помочь мне пройти через это, я был бы признателен, я потерян

Ответы [ 3 ]

2 голосов
/ 17 марта 2012 
function selectClosest(val){
var diffs = [];
$("li[position]").each(function(){
    diffs.push(Math.abs(parseInt($(this).attr("position"))-val));
});
$("li[position]").eq(diffs.indexOf(Math.min.apply( Math,diffs))).css("font-weight","bold");
}

selectClosest(551);
1 голос
/ 17 марта 2012

Полагаю, вы могли бы выполнить бинарный поиск по массиву позиций: просто создайте массив позиций, отсортированных по атрибуту «position», и выполните бинарный поиск: 

var positions = [];
$("[position]").sort(function (a, b) {
    return $(a).attr("position") - $(b).attr("position")
})
.each(function () {
    positions.push(parseInt($(this).attr("position")));
});
0 голосов
/ 17 марта 2012

Использование решения в этом посте Формальный способ получения ближайших значений в массиве в Javascript, с учетом значения и отсортированного массива? Вы можете сделать что-то вроде этого: http://jsfiddle.net/elclanrs/phFUq/

var num = 600, // scroll number
    $li = $('li'),
    pos = [];

$li.each(function() {
    pos.push($(this).attr('position'));
});

function sortfunc(a, b) { // To sort `pos` array
    return a - b;
}
var getClosestValues = function(a, x) {
    var lo, hi;
    for (var i = a.length; i--;) {
        if (a[i] <= x && (lo === undefined || lo < a[i])) lo = a[i];
        if (a[i] >= x && (hi === undefined || hi > a[i])) hi = a[i];
    };
    return [lo, hi];
};

$('li[position=' + 
    getClosestValues(pos.sort(sortfunc), num)[0] + 
    ']').toggleClass('red'); // Or whatever...
...