3

次のhtmlファイルがあります：

<div id="tour">
 <h2>Paris, France Tour</h2>
 <p>$2,499 for 7 Nights</p>
 <button>See photos from our last tour</button>
 <ul class="photos">
   <li>
   <img src="/assets/photos/paris1.jpg">
   <span>Arc de Triomphe</span>
   </li>
   <li>
  <img src="/assets/photos/paris2.jpg">
  <span>The Eiffel Tower</span>
  </li>
  <li>
  <img src="/assets/photos/paris3.jpg">
  <span>Notre Dame de Paris</span>
  </li>
 </ul>
</div>

これは私のjQueryコードです:

function showPhotos()
{
    $(this).find("span").slideToggle();
}

$(document).ready(function() { 
    $("#tour").on("click", "button", function() { 
        $(".photos").slideToggle();
    });

    $(".photos").on("mouseenter", "li", showPhotos);
    $('.photos').on("mouseleave", "li", showPhotos);
});

このコードは機能し、マウスが img 要素に入るとスパンが表示されます。しかし、同じことを次のようにしようとすると:

function showPhotos()
{
    $(this).find("span").slideToggle();
}

$(document).ready(function() { 
    $("#tour").on("click", "button", function() { 
        $(".photos").slideToggle();
    });
    $(".photos").on("mouseenter", "li", function() {
        showPhotos();
    });
    $('.photos').on("mouseleave", "li", function() {
        showPhotos();
    });
});

うまくいきません。私の限られた知識では、両方のコードが同じことをしているようです。私を助けてください、2番目のコードは最初のコードとどう違うのですか?

4

4 に答える 4

0

2 番目のケースでは、関数 showPhotos() を呼び出す代わりに; 中身

  $(".photos").on("mouseenter", "li", function() {
  });

関数 i,e の実際のコードを書く 

  $(this).find("span").slideToggle();

動作します。

于 2013-06-13T07:12:02.070 に答える