添加新的滚动内容(克隆）到 jQuery UI 滑块

Add new scroll content (clone) to jQuery UI slider?

本文关键字：jQuery UI 滑块 克隆 滚动 添加      更新时间：2023-09-26

所以我在小提琴中有一个类似于以下内容的滑块，需要选择添加新内容（块或滚动内容项）。添加后，我将进行内联编辑以更改以下文本，但我更希望当克隆块时，其中没有以前的数字或文本。提前谢谢。http://jsfiddle.net/4QEgr/1/

$(".addNew").on("click", function(event){
    //clone last block
    //add new block to slider div
});

我的内容项保存此内容，我需要在克隆时清除标签。

<div class="scroll-content-item ui-widget-header folder1">
    <span class="glyphicon glyphicon-folder-close icon-set" title='Folder1'>
        <label class='folderLbl'>Folder1</label>
    </span>
</div>

只需使用这个：

$(".addNew").on("click", function (e) {
    scrollContent.append(function(){
        return $(this).find('.ui-widget-header:last')
                      .clone()
                      .text(function(i, h){
                          return parseInt(h, 10)+1;
                      });
    });
});

单击.addNew时，它会获取最后一个.ui-widget-header块，克隆它，递增数字并将其附加到.scroll-content容器div。

它在这里工作：http://jsfiddle.net/v3K3m/

更新：

如果您的示例 HTML 块是：

<div class="scroll-content-item ui-widget-header folder1">
    <span class="glyphicon glyphicon-folder-close icon-set" title='Folder1'>
        <label class='folderLbl'>Folder1</label>
    </span> 
</div>

然后你可以只使用：

$(".addNew").on("click", function (e) {
      scrollContent.append(function () {
          return $(this).find('.ui-widget-header:last')
              .clone()
              .find('.folderLbl')
              .html(function (i, h) {
                  return 'Folder' + (parseInt(h.match(/'d+$/), 10)+1);
              }).parents('.ui-widget-header');
      });
  });

它在这里工作：http://jsfiddle.net/ybmYD/

相关文章：