Question

我想将一个文本块包装成div，这样每个div都有相同数量的字符。目标是制作可以在书的相似页面之间点击的div，即分页。我遇到麻烦但是使用each（）语句将文本块的每个段包装成它自己的等长的div。

Jere的代码Hhich适用于一个div，但尚未制作多个div：

HTML：

<div id="content">hi my name is joe. I work at a school.</div>
<div id="count"></div>
<button>wrap</button>

JavaScript的：

$('button').on('click', function(){ 
  var content=$('#content').text();
  $('#count').text(content.length);        
  /*   var length20; //20 character long text block
    if(content.length>=20);
      $.each(length20, function(){
    length20.wrap('<div class="new" />');   
    }            
 */ 
});

如果您想直接编辑代码，请点击the fiddle。

如果有人能够编辑这个小提琴以修复其each()声明，我将非常感激。

Answer 1

尝试这样的事情：

$('button').on('click', function(){ 
     var content=$('#content').text();
     //'5'-length blocks
     var parts = content.match(/.{1,5}/g);
     $('#count').text(parts.length);   
     $.each( parts, function( index, part ){
        $("body").append ('<div class="New">'+part+'</div>')
     });
});

使用javascript将每个特定长度的文本块包装到自己的div中

1 个答案: