jQuery를 사용하여 커서 아래의 내용을 "강조 표시"

커서 주위에 테두리를 추가하여 현재 커서가 가리키는 요소를 강조 표시하는 jQuery 코드를 작성하려고합니다.jQuery를 사용하여 커서 아래의 내용을 "강조 표시"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Hover Test</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script> 
    $(function() { 
     $("*:not(html, head, body)").hover(function() { 
      $(this).css("border", "2px solid purple"); 
     }, 
     function() { 
      $(this).css("border", "none"); 
     }).click(function() { 
      alert($(this).html()); 
     }); 
    }); 
</script> 
</head> 

<body> 
<div> 
    <p>This is paragraph one</p> 
    <p>This is paragraph two</p> 
</div> 
<span id="curtag"></span> 
</body> 
</html>

그것은 또한이 경우 부모 태그 사업부를 강조 이하 나는 예에서 단락과 같이 위에 마우스를 할 때 문제가 : 여기에 지금까지 가지고있는 코드입니다. 또한 단락을 클릭하면 p의 html과 div의 html을 얻을 수 있지만 p 태그의 HTML 만 필요합니다. 이 문제를 해결하는 방법에 대한 제안 사항이 있으십니까?

출처

2009-11-13 blcArmadillo

는 부모에게 bubbeling에서 mouseOver 이벤트를 중지하려면이

$(function() { 
    $("*:not(html, head, body)").hover(function() { 
      $(this).css("border", "2px solid purple"); 
    return false; 
    }, 
    function() { 
      $(this).css("border", "none"); 
    }).click(function() { 
      alert($(this).html()); 
      return false; 
    }); 
});

처럼

return false;

를 추가합니다.

출처

2009-11-13 19:23:41

답장을 보내 주셔서 감사합니다. 그게 꽤 잘 작동하는 유일한 경우는 div 주먹을 강조 표시 한 다음 단락 태그로 이동합니다. 왜냐하면 div가 강조 표시되어 있기 때문에 그 위에 커서를 올려 놓지 않았기 때문입니다. – blcArmadillo

hover() 이벤트를 트리거 할 수있는 요소가 너무 일반적입니다. the element the cursor is currently hovering over이라고 말하면, 적절하게 모든 테두리를 가져 오는 몇 가지 중첩 요소를 나타냅니다.

텍스트가 <p>에만있는 경우 국경을 트리거하면 안됩니까?

$('p').hover(function() { etc.....

출처

2009-11-14 03:02:53 carillonator

jQuery를 사용하여 커서 아래의 내용을 "강조 표시"

답변

관련 문제