javascript - 悬停时如何显示id div

Question

我有几个 div，当我将鼠标悬停在其中一个上时，我想在 div 上显示 id

<div id="display_id_div" >hover me</div>

谢谢。我的 html

<div id="display_id_div" >hover me</div>
<div id="div1" >hover me</div>
<div id="div2" >hover me</div>
<div id="div3" >hover me</div>

. jQuery代码：

$(div).hover(function(){
    $("#display_id_div") =  $(this.id);
})​

Answer 1

你混淆了函数和赋值，你不能给函数调用赋值。

您的代码中有几个错误：

$(div).hover(function(){

是什么div？变量还是？如果您的意思是在您的 html 中选择divs，您需要执行以下操作：

$('div[id^=div]')

该[id^=div]部分是选择div以 id 开头的 sdiv

所以现在你的代码看起来像

$('div[id^=div]').hover(function() {
   $("#display_id_div") =  $(this.id);
});

你需要修改innerHTMLof #display_id_div，所以你使用

$('#display_id_div').html(this.id);

如果您注意到，有两种使用方法.html()，作为 setter 和 getter。在给定参数的情况下，它在这里充当设置器。如果在没有参数的情况下调用，它是一个 getter

最终代码：

$('div[id^=div]').hover(function() {
    $('#display_id_div').html(this.id);
});

Answer 2

演示 http://jsfiddle.net/jJRJT/4/​​ 或http://jsfiddle.net/jJRJT/5/

代码

$("div").hover(function(){
      alert(this.id);
})​;

或者

把它放在html中

$("#display_id_div").html(this.id);

Answer 3

$('div').hover(function(){ // attach hover callback to all divs.
    $('#display_id_div').html(this.id); // change display_id_div innerHTML value
                                        // to the hovered id.
})​;

Answer 4

只需编写您需要使用.html()函数jquery的这行代码

$("#display_id_div").html( $(this).attr('id'));

你最终的代码将是

 $("div").hover(function()
  { 
    $("#display_id_div").html(  $(this).attr('id'));
  });​