将内容包装在div中然后appendTo

时间:2014-03-07 03:47:31

标签: javascript jquery

我正在尝试将appendcontent包装到image div中,但返回了[object Object]。

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

如何将$(appendcontent)放入$("<div class=image></div>" )

在线样本 http://jsfiddle.net/PYQXa/5/

我知道我可以使用html()但是如果我输入html(),滑块将无效。这就是我需要保留对象的原因。

3 个答案:

答案 0 :(得分:2)

您可以使用.append

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

.wrap

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

通常的做法是为包含$的jQuery对象的变量添加前缀(例如$appendcontent)。

答案 1 :(得分: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

答案 2 :(得分: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 
);