Question

我有一个画廊，标题应该是我的标题。现在我希望画廊外的标题位于一个单独的div中。这就是我通过图像获取标题的方式。但是如何将显示图像的标题附加到单独的div中？

var appendCaptions = function(){
        // cycle through each child
        slider.children.each(function(index){
            // get the image title attribute
            var title = $(this).find('img:first').attr('title');
            // append the caption
            if (title != undefined && ('' + title).length) {
                $(this).append(title);
            }
        });
    }


<ul class="bxslider">
              <li><img src="images/1.jpg" title="Happy trees" /></li>
              <li><img src="images/1.jpg" /></li>
              <li><img src="images/1.jpg" title="Happy tre333es" /></li>
              <li><img src="images/1.jpg" title="Happy treeffees" /></li>
            </ul>
<div class='title'></div>

我希望标题显示在div标题内;我正在使用的滑块是bxslider

Answer 1

你需要像在每个迭代器中一样打破循环，所以试试：

var appendCaptions = function(){
        // cycle through each child
        slider.children.each(function(index){
            // get the image title attribute
            if( $(this).is(':visible')){
            var title = $(this).find('img:first').attr('title');
            // append the caption
            if (title != undefined && ('' + title).length) {
                $('#myDiv').append(title);
                return false;
            }
          }
       });
    }

Answer 2

这是你要找的吗？

$("#myTitleDiv").html(title);

jQuery documentation非常棒。

Answer 3

放置一些HTML。

我假设您正在尝试：

获取每个滑块图片的标题
将标题附加到作为此图像容器的每个div。

也许尝试这样的事情：

var appendCaptions = function(){
        // cycle through each child
        slider.children.each(function(index){
        // get the image title attribute
        var title = $(this).find('img:first').attr('title');
        // append the caption
        if (title != undefined && ('' + title).length) {
            $(this).parents("div.singleImgContainer").append(title);
        }
    });
}

这将找到具有classImgContainer类的div，并将标题放入其中。

jquery附加在单独的div中

3 个答案: