listview에서 임의의 옵션에 대한 툴팁 얻기

Question

예를 들어, 1) Asian 2) Euorpian 3) ......이 listview는이 데이터에 액세스하는 JSP 스크립트를 호출하여 채워집니다. 3 개 이상의 모든 옵션)을 데이터베이스에서 가져옵니다. 모든 옵션 (onmousemove 함수) 위에 마우스를 올려 놓았을 때 작은 팝업 창 (도움말 창과 같이)을 표시하고 싶습니다. 예를 들어, 아시아에 마우스를 올려 놓으면 작은 도움 표시 인디언, 중국어, 태국어 등이 표시됩니다. 이 데이터 인디언, 중국어 .... 관련 정보가 데이터베이스에 저장되어 있기 때문에 jsp 파일을 호출하여 다시 나타납니다. 따라서 listview의 모든 옵션에는 데이터베이스에서 동적으로 변경되는 다른 정보가 있습니다.

누구나이 방법을 제안 할 수 있습니까?

Answer 1

"javascript tooltip"또는 "jquery tooltip"에 대해 정확히 Google에 준비된 자바 스크립트 라이브러리가 많이 있습니다.

당신이 어떤 팽창을 원하지 않는다면 jquery를 사용하고 간단히 툴팁을 만드는 것이 좋습니다.

예 : 이 그냥 아주 맨 기본적인 예입니다

$("select > option").hover(function({ 
    pos = $(this).position(); 
    $(this).before($("<div>").css({position: absolute,left: pos.left,top: position.top}).text("Your Text")); 
}); 

주, 당신은 여전히 ​​약 오프셋 생각하고 부모 요소뿐만 아니라 위치를 오프셋 수 있음을 고려해야 할 것이다. 링크 자체를 상대적으로 배치하고 위치 감지를 건너 뛸 수 있습니다.

또한 listView 옵션 노드에는 의도적으로 이벤트가 연결되어 있다고 생각하지 않기 때문에 모든 브라우저에서 호버 이벤트가 트리거되지 않을 것이라고 생각합니다. 대체 플로우를 고려하거나 javascript 라이브러리를 사용하여 이벤트를 옵션 노드에 첨부 할 수있는 사용자 정의 listView 요소를 표시해야합니다. 다음은 몇 가지가 사용할 수 있습니다 :

http://www.queness.com/post/204/25-jquery-plugins-that-enhance-and-beautify-html-form-elements#9

어쨌든이 당신에게 시작하는 무언가를 제공해야합니다.