다음 onmouseover 이벤트까지 onmouseout을 통해 대기 할 onmouseover 스왑 이벤트를 얻으려면 어떻게해야합니까?

누군가가 디스플레이를 유지하기 위해 onmoseover 이벤트를 받도록 도와주십시오 : 블록; 내가 다른 일을 onmouseover 할 때까지 행동? 다른 말로하면 다른 이벤트를 onmouseover 할 때까지 이벤트를 계속 볼 수 있습니다. 대답은 간단합니다. 나는 2 일 자바 스크립트에 새로운이야.다음 onmouseover 이벤트까지 onmouseout을 통해 대기 할 onmouseover 스왑 이벤트를 얻으려면 어떻게해야합니까?

CSS

.box { 
    width: 900px; 
    height: auto; 
    margin-top: 20px; 
    padding: 0px 0px 15px 0px; 
    border: 5px solid black; 
    margin-left: auto; 
    margin-right:auto;

}

HTML

<div class="box" style='width:400px; height:auto;> 

<p style="display:inline;" 
    onmouseover="document.getElementById('sometext1').style.display = 'block';" 
    onMouseOut="document.getElementById('sometext1').style.display = 'none';"> 
<span>some text1</span></p> 

<p style="display:inline;" 
    onmouseover="document.getElementById('sometext2').style.display = 'block';" 
    onMouseOut="document.getElementById('sometext2').style.display = 'none';"> 
<span>some text2</span></p> 

<p style="display:inline;" 
    onmouseover="document.getElementById('sometext3').style.display = 'block';" 
    onMouseOut="document.getElementById('sometext3').style.display = 'none';"> 
<span>some text3</span></p> 



<div id="sometext1" style="display: none;"> 
    <p>paragraph of content for sometext1</p> 
</div> 

<div id="sometext2" style="display: none;"> 
    <p>paragraph of content for sometext2</p> 
</div> 

<div id="sometext3" style="display: none;"> 
    <p>paragraph of content for sometext3</p> 
</div> 

</div>

출처

2014-09-01 jamnel1

먼저 HTML은 다음과 같이해야합니다 : JS 파일에 이벤트 리스너에 대한

<div class="box" style='width:400px; height:auto;> 

<p id="text1" onmouseover="mouseoverHandler(this.id)" style="display:inline;"><span>some text1</span></p> 
<p id="text2" onmouseover="mouseoverHandler(this.id)" style="display:inline;"><span>some text1</span></p> 
<p id="text3" onmouseover="mouseoverHandler(this.id)" style="display:inline;"><span>some text1</span></p> 

<div id="sometext1" style="display: none;"> 
    <p>paragraph of content for sometext1</p> 
</div> 

<div id="sometext2" style="display: none;"> 
    <p>paragraph of content for sometext2</p> 
</div> 

<div id="sometext3" style="display: none;"> 
    <p>paragraph of content for sometext3</p> 
</div> 

</div>

쓰기 기능 :

var previousId = null; 
function mouseoverHandler(e){ 
    if (previousId != e) { 
     document.getElementById('some' + e).style.display = 'block'; 
     if (previousId != null) { 
      document.getElementById('some' + previousId).style.display = 'none'; 
     } 
    } 
    previousId = e; 
}

단락 요소를 div 식별자로 생각하고 둘 사이의 관계가 있습니다.

출처

2014-09-01 01:37:29 PashaB

감사합니다. PashaB. 이 구문은 이전에했던 것보다 훨씬 효율적입니다. 고맙습니다. 그러나 트리거 이벤트에서 마우스를 움직일 때 내용을 볼 수있게 유지하는 방법에 대해서는 여전히 확신이 없습니다. mouseover text1 마우스를 움직여도 내용이 계속 보이도록하고 싶습니다. 난 text1 또는 text2 또는 text3 다른 mouse1 다른 text1 text2 또는 text3까지 볼 수 남아 싶습니다. 현재와 마찬가지로 내용이 즉시 표시됩니다. 아무도 트리거에서 마우스를 움직이지 않습니다. – jamnel1

js 파일에 하나의 전역 변수를 설정 한 다음 mouseoverHandler 함수에서 e (e는이 경우 요소 id)로 설정 한 다음 if 문을 사용하여 이전 요소와 요소 id를 검사합니다. 나는 답안을 편집했다. – PashaB

Javascript에 들어갔을 때 그것이 훨씬 더 어려울 것이라고 생각했습니다. 나는 그것에 대해 제대로 생각할 필요가 있습니다. 내가 갖겠다. 당신은 최고예요!!! 고맙습니다. – jamnel1

다음 onmouseover 이벤트까지 onmouseout을 통해 대기 할 onmouseover 스왑 이벤트를 얻으려면 어떻게해야합니까?

답변

관련 문제