Question

<ul id='ulid'>
<li>Task1</li>
<li>Task2</li>
<li>Task3</li>
<li>Task4</li>
<li>Task5</li>
<li>Task6</li>
<li>Task7</li>
</ul>
<div id="show_details"></div>

我想用什么JavaScript来将li的详细信息复制到div mouseover mouseout隐藏{{1}}上。

Answer 1

如果您的意思是“详细信息”的“内容”，您可能需要尝试：

var $details = $('#show_details');
$('ul > li').hover(function(){
   $details.text($(this).text());
}, function(){
   $details.text('');
});

参考：.hover()

Answer 2

参考： jQuery.hover() ， jQuery.html() ， jQuery.empty()

$(function() {
 $('li').hover(function() {
    $('#show_details').html( $(this).text() );
  }, function() {
    $('#show_details').empty()
 });
});

Answer 3

这适用于特定的ul：

jQuery(document).ready(function(){

 $('ul#ulid li').hover(function() {
    $('#show_details').html( $(this).text() );
  }, function() {
    $('#show_details').html( '' );
 });

});

Demo

jQuery li悬停完整的代码

3 个答案: