2016-12-02 1 views
1

의 :옵션 요소의 jQuery를 위치는 항상 0,0 select 요소에 대한 IE

<select id="s1" size="4"> 
    <option>o1</option> 
    <option>o1</option> 
    <option>o1</option> 
    <option>o1</option> 
    </select> 

다음 코드는 항상 크롬에서 IE 11 0 0 만 26 구를 반환

var selectelem = document.getElementById("s1"); 
    var children = selectelem.querySelectorAll("option"); 
    console.log($(children[1]).position().top + " " + $(children[1]).position().left); 

인가가 이 문제를 해결할 수있는 방법은 무엇입니까?

+0

console.log (children [1] .getBoundingClientRect());를 사용하여 시도했습니다. – user4617883

+0

IE 디벨로퍼 도구 (0, 0, 자동, 자동)에 나타나지 않습니다. 남자는 대신 목록을 사용하거나 오프셋을 계산할 수 있습니다. – Lain

답변

0

익스플로러에서는 아직 볼 수 없습니다.

여기 enter image description here

이 오래된 질문 같은 요구된다 : 경계 심지어 developper 도구에 표시되지 않습니다

JavaScript get position of option element?

Alternativly 그냥 좋은 오래된 목록을 사용

(UL과 li) :

<ul> 
    <li>o1</li> 
    <li>o1</li> 
    <li>o1</li> 
    <li>o1</li> 
</ul> 

포지션 계산을 시도 할 수도 있지만 노력할 필요가 없습니다.

<html> 
    <script> 
     window.setTimeout(function(){ 
      var tS = document.querySelector('select'); 
      var tB = tS.getBoundingClientRect(); 

      for(var tL=tS.querySelectorAll('option'), tM=Math.max(tL.length, ~~tS.getAttribute('size')), i=0, j=tL.length; i<j; ++i){ 
       console.log(tB.height/tM * i + tB.top) 
       console.log(tL[i], tL[i].offsetTop, tL[i].getBoundingClientRect().top) 
      } 
     }, 1000) 
    </script> 

    <body> 
     <select id="s1" size="4"> 
      <option>o1</option> 
      <option>o1</option> 
      <option>o1</option> 
      <option>o1</option> 
     </select> 
    </body> 
</html> 
관련 문제