2014-03-07 91 views
1

我試圖將appendcontent換成image div,但得到了[object Object]返回。在div中包裝內容,然後appendTo

$("<div class=image>" + appendcontent + "</div>").appendTo($('.outside')); 

如何把$(appendcontent)$("<div class=image></div>")

在線樣本 http://jsfiddle.net/PYQXa/5/

我知道我可以使用html(),但如果我把HTML(),滑塊將無法正常工作。這就是我需要保持對象的原因。

+1

您可以包括'appendcontent'就是一個例子嗎?它是一個文本字符串? HTML? –

+1

appendcontent是一個jQuery對象。也許你正在尋找appendcontent.html()? – psquared

+0

如果我使它html(),滑塊將無法正常工作 – olo

回答

2

您可以使用.append

$('<div class="image">').append(appendcontent).appendTo('.outside'); 

或者.wrap

appendcontent.wrap('<div class="image">').appendTo('.outside'); 

這也是一種常見的做法包含的jQuery與$(例如$appendcontent)對象前綴的變量。

1

一些變化在這裏:

  • 包裝你的類中引用' '或雙引號" "

  • 您需要使用appendcontent.html(),而不是appendcontent,因爲appendcontent是一個jQuery對象:

  • appendTo('.outside')代替appendTo($('.outside'))

因此,它看起來像這樣:

$("<div class='outside'>" + appendcontent.html() + "</div>").appendTo('.outside'); 

您可以使用append()然後appendTo()代替:

$('<div class="image">').append(appendcontent).appendTo('.outside'); 

Updated Fiddle

+0

謝謝!但是,如果我使它html(),滑塊將無法正常工作http://jsfiddle.net/PYQXa/6/ – olo

+1

檢查我的更新。 – Felix

+1

@olo:順便說一句,你可以明顯地命名變量,但是使用'$'預先掛起的變量名通常意味着一個jQuery對象。 – psquared

1

我創建的jsfiddle這裏

http://jsfiddle.net/j5jdb/ 

jQuery的

var $inside = $('.inside'); 
//$inside.hide(); 
var appendcontent = $inside.find('.slider').html(); 
//$(appendcontent).appendTo($('.outside')); 

// $("<div class=outside>" + appendcontent + "</div>").appendTo($('.outside')); 


// settings 
var $slider = $('.slider'); // class or id of carousel slider 
var $slide = 'li'; // could also use 'img' if you're not using a ul 
var $transition_time = 1000; // 1 second 
var $time_between_slides = 4000; // 4 seconds 

function slides(){ 
    return $slider.find($slide); 
} 

slides().fadeOut(); 

// set active classes 
slides().first().addClass('active'); 
slides().first().fadeIn($transition_time); 

// auto scroll 
$interval = setInterval(
    function(){ 
     var $i = $slider.find($slide + '.active').index(); 

     slides().eq($i).removeClass('active'); 
     slides().eq($i).fadeOut($transition_time); 

     if (slides().length == $i + 1) $i = -1; // loop to start 

     slides().eq($i + 1).fadeIn($transition_time); 
     slides().eq($i + 1).addClass('active'); 
    } 
    , $transition_time + $time_between_slides 
);