javascript - 添加新的滚动内容(克隆)到 jQuery UI slider ?

标签 javascript jquery jquery-ui clone addition

因此,我在 fiddle 中有一个类似于以下内容的 slider ,需要选择添加新内容( block 或滚动内容项)。添加后,我将进行内联编辑来更改以下文本,但我更希望在克隆 block 时,其中没有以前的数字或文本。提前致谢。 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 block ,克隆它,增加数字并将其附加到.scroll -content 容器 div。

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

更新:

如果您的示例 HTML block 是:

<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/

关于javascript - 添加新的滚动内容(克隆)到 jQuery UI slider ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18700845/

相关文章:

javascript - 两个输入框之间的 jQuery .val Enigma

javascript - Javascript 中的简单 createElement 问题

javascript - 将常规文本输入转换为 DD/MM/YYYY 格式

javascript - 如何创建每个对象属性的数组?

javascript - 在 Safari 中禁用 flex 滚动

jquery - 当 mouseleave() 的当前选择器时中断 mouseenter 动画

javascript - jQuery 日期选择器不显示绑定(bind)日期

javascript - 视差 "scrolling"仅通过导航

javascript - jquery .attr() 返回未定义

javascript - jquery单滑动 handle