2013-01-10 5 views
8

를 사용하여 가장 가까운 일치하는 값 찾기 나는 나와 함께 값이 같은jQuery를 또는 자바 스크립트

<select id="blah"> 
    <option value="3">Some text</option> 
    <option value="4">Some text</option> 
    <option value="8">Some text</option> // <---- target this tag based on value 7 
    <option value="19">Some text</option> 
</select> 

가정하자 같은 마크 업을 고려, 7. 그 value 속성 (7)에 가장 가까운 옵션 태그를 대상으로하는 것이 가능 말하고있는 ,이 경우 <option value="8">일까요?

저는 $으로 끝나는 것을 의미하는 ^을 알고 있습니다.이 값은 다음과 같이 끝나는 것을 의미하며 주어진 값에 가장 근접한 것을 찾기 위해 이와 같은 것이 있으면 바랬습니다.

+4

만에 가장 가까운 가장 높은 값을 찾고 계십니까? 예를 들어'6','5'가 유효할까요,'7'입니까? –

+0

최고 또는 최저 일 수 있습니다 ... 중요하지 않습니다. 그 요소를 대상으로하고 그 앞에 또는 앞에 다른 옵션 태그를 추가하고 싶습니다. – asprin

+0

옵션이 값순으로 정렬되어 있습니까? –

답변

4

나는 같이 갈거야 :

http://jsfiddle.net/GNNHy/

var $tmpOption = $('<option value="7">Some text 7</option>'); 
$("#blah").append($tmpOption); 
var my_options = $("#blah option"); 
my_options.sort(function(a,b) { 
    if (parseInt(a.value,10) > parseInt(b.value,10)) return 1; 
    else if (parseInt(a.value,10) < parseInt(b.value,10)) return -1; 
    else return 0 
}) 

$("#blah").empty().append(my_options); 
+3

완벽 해요! 추가 한 다음 정렬하십시오! 논리는 너무 단순했지만 아직 놓쳤습니다. +1하고 수락 함 – asprin

1

예 옵션 값 (각 기능 사용)을 사용하여 값 (7)을 빼십시오 ... 최소의 긍정적 인 결과를 가진 값이 목표 옵션이됩니다. 원하는 결과를 얻길 바랍니다.

+0

"가장 가까운 것"은 올바른 대답이라고 생각하지 마십시오 –

+0

+1 답변을 게시하는 데 시간이 걸립니다. – asprin

3

재귀는 어떨까요? 그것은 가장 가까운 값을 찾을 수 있습니다 :

JS-BIN Demo

function getClosest(val, ddl, increment){ 
    if(ddl.find('option[value="'+val+'"]').length){ 
     return val; 
    } 
    else 
    try{ 
     if(increment) 
    return getClosest(++val, ddl, increment); 
     else 
     return getClosest(--val, ddl, increment); 
    } 
    catch(err){ 
    return -1; 
    } 
} 

function findClosest(val, ddl){ 
    var larger = getClosest(val, ddl, true); 
    var smaller = getClosest(val, ddl, false); 
    if(larger == smaller == -1) 
    return -1; 
    else if (larger == -1) 
    return smaller; 
    else if (smaller == -1) 
    return larger; 

    if(larger - val > val - smaller) 
    return smaller; 
    else 
    return larger 
}  
+0

가장 가까운 –

+0

로 업데이트되었습니다.이 시점에서 귀하의 답변은 나의 것보다 길다. 어째서? :-) –

+0

음. 나는 힘든 방법을하고 있다고 생각한다. –

1

가장 쉬운 방법은 (당신이 바이너리 할 수 ​​있지만 평소보다 더 까다로운) 아마도 예전의 좋은 선형 검색입니다 :

var target; 
var $options; 

var best=Infinity; 
var bestAt; 

$options.each(function(){ 
    var error = this.value - target; 
    error = error>0 ? error : -error; 
    if(error<=best){ 
    best=error; 
    bestAt=this; 
    } 
}) 

//return $(bestAt); 
+0

+1 답변을 게시하는 데 시간이 걸립니다. – asprin

1

jquery를 사용할 수 있다면

$(function() { 
     // comes from somewhere 
     var val = 7; 

     var sortByDifference = $("#blah option").sort(function (opt1, opt2) { 
      return Math.abs(parseInt($(opt1).val()) - val) - Math.abs(parseInt($(opt2).val()) - val); 
     }); 

     alert($(sortByDifference[0]).val()); 
    }); 

sortByDifference에서 모든 값은 값과 얼마나 가까운지에 따라 정렬됩니다. 루틴은 가장 가까운 위 또는 아래를 반환하며 옵션을 정렬 할 필요가 없습니다.

+0

답변을 게시하는 데 시간이 걸리는 경우 +1. – asprin

1
function findClosest(num){ 
    var select = document.getElementById('blah'); 
    var options = select.options; 
    var dif = Infinity; 
    var index; 
    for(var i = 0; i < options.length; i++){ 
     var newdif = Math.abs(parseInt(options[i].value) - num); 
     if(newdif < dif){ 
      dif = newdif; 
      index = i; 
     } 
    } 
    select.selectedIndex = index; 
} 
+0

무엇이'9007199254740992'입니까? 그것은 끔찍한 냄새가 난다 :-) –

+0

(x + 1 == x)가 가장 좋은 무한대가 아닌 것과 같은 가장 작은 수에 주목하자. 2^53 냄새가 나쁘다. –

+0

답변을 게시하는 데 시간이 걸리는 경우 +1. – asprin

관련 문제