1. 首頁
  2. 問答
  3. jquery append new div

jquery append new div

2011-08-14 110 views
2

我想做懸停在一個div中，在身體部分追加一個新的div，這裏的一些代碼。jquery append new div

但我的問題是：現在它不是追加一個新的div，而是替換第一個所有的html。哪裏有問題？謝謝。 http://jsfiddle.net/U7QqB/3/

JS

jQuery(document).ready(function() { 
    $('.click').hover(function(){ 
    var html = $(this).find('.text').html(); 
    $('body').append('<div id="object"/>').html(html).css({'top':'200px','left':'300px','z-index':'10'}); 
    }); 
});

CSS

.click{position:realavite;top:100px;left:300px;} 
.text{display:none;} 
.object{position:absolute;}

HTML

<body> 
<h1>A hover append div text</h1> 
<div class="click"> 
    <img src="http://nt3.ggpht.com/news/tbn/U7Q-7enFr00rUM/1.jpg" /> 
    <div class="text">text</div> 
</div> 
</body>

來源

2011-08-14 fish man

回答

7

這是因爲append()返回原 jQuery對象（含<body> ELE的一個），而不是包含附加內容的新內容。

您可以使用appendTo()代替：

$('<div id="object">').appendTo('body').html(html).css({ 
    'top': '200px', 
    'left': '300px', 
    'z-index': '10' 
});

來源

2011-08-14 13:41:04

1 
$('<div/>',{ 
    id: 'object' 
}).appendTo('body') 
    .html(html) 
    .css({ 
    'top': '200px', 
    'left': '300px', 
    'z-index': '10' 
});

來源

2011-08-14 13:48:54 thecodeparadox

相關問題

 相關問題