javascript - mouseenter 和 mouseout 事件显示边框

Question

我有以下 html 结构:

         <div>
             <p>Name <img src="url" alt="Image A"></p>
             <p>Age <img src="url" alt="Image B"> </p>
             <p><img src="url" alt="Image C"></p>
         </div>

当 mouseenter 发生在 html 中的任何元素上时，我只想在鼠标悬停的元素上显示红色边框。当前的代码是:

       $("*").mouseenter(
                  function(){
                     $(this).css("border","solid red");
        }).mouseleave(
                function(){
                     $(this).css("border","none");
        });

但是，当我的鼠标进入图像 A 时，保存图像 A 的段落带有图像 A 的边框。我只希望图像 A 有边框。谁能建议我如何去做这件事？

Answer 1

用这个

http://jsfiddle.net/bBx2z/

$("p:first").mouseenter(
                  function(){
                     $(this).css("border","solid red");
        }).mouseleave(
                function(){
                     $(this).css("border","none");
        });