Mam dwa akapity. Najpierw chciałbym oddzielić każde słowo w pierwszej kolejności, owinąć go z identyfikatorem, a następnie przesuń się na przykład 5 pierwszych słów do akapitu drugiego (ze spacjami). Problem polega na tym, że nie wiem, czy dołącz ("') jest dobrym pomysłem, a drugi problem polega na tym, że po wstrzyknięciu rozpiętości do drugiej szerokości akapitu jest zbyt duża (powinna wynosić 100px z tekstem nakładającym się na następny Linia Juza jak w pierwszym akapicie

Oto moja próba

    <body>
<script type="text/javascript">
    $(function(){
        var obj = $('.p1')
        var text = obj.html().split(' '), len = text.length, result = [];
                for( var i = 0; i < len; i++ ) {
                    result[i] = '<span id="'+i+'">' + text[i] + '</span>';
                }
                obj.html(result.join(' '));

            var words = $('.p1').find('span');
            for(var i = 0; i < 5; i++){
                $('.p2').append($(words[i]).clone());
                $('.p2').append('&nbsp;');
            }
    });
</script>

<div class="test" style="width:100px">
<p class="p1">
test1 test2 test3 test4 test5 test6 test7 test8
</p>
</div>
<div class="test" style="width:100px">
<p class="p2">
</p>
</div>
</body>
1
gruber 26 wrzesień 2012, 03:35

3 odpowiedzi

Najlepsza odpowiedź

Użyj $('.p2').append(' '); zamiast $('.p2').append('&nbsp;');

&nbsp; = nie łamana przestrzeń

1
Reflective 25 wrzesień 2012, 23:48

Coś takiego?

$(function() {
    var txt = $('.p1').text().split(' ')
        len = txt.length,
        result = [];
    for (var i = 0; i < len; i++) {
        result[i] = '<span id="' + i + '">' + txt[i] + '</span>';
    }
    $('.p1').html(result.join(' '));
    $('.p1 span:gt(0)').appendTo('.p2');
});​

http://jsfiddle.net/ulmvt/

Zauważ, że jeśli chcesz przesunąć elementy, nie powinieneś ich sklonować.

2
undefined 26 wrzesień 2012, 00:05

Jsbin Demo

   var obj = $('.p1'),
       text = obj.html().split(' '),
       len = text.length,
       result = [];

   for( i=0; i<len; i++ ) {
        result[i] = '<span id="'+i+'">' + text[i] + '</span>';
   }
   obj.html(result.join(' '));

  $('.p1 span:lt(5)').clone().appendTo('.p2').after(' ');
1
Roko C. Buljan 25 wrzesień 2012, 23:50