jQuery的分頁將第二頁上的項目，並沒有限制列表中，這樣不實際分頁

見我的jsfiddle http://jsfiddle.net/iamdanbarrett/frbh9/jQuery的分頁將第二頁上的項目，並沒有限制列表中，這樣不實際分頁

因此，這是內聯JS的PAGINATE上.....

  <script> 
         $(window).load(
function() 
{ 
    var o=$('#paginate').first(), 
     h=o.height(), 
     c=$('<div/>').css('width',o.width()).addClass('part'), 
     cc,i=1,item, 
     p=$('<div id="pagination"></div>').append($('<a/>').text('['+1+']').data({i:0})); 

     o.before(p); 


    do{ 
     if(typeof cc=='undefined'){cc=c.clone().appendTo(o);} 


    item=o.children().not('.part').first().appendTo(cc.first()); 

    if(cc.children().length>0 && cc.height()>=h) 
    { 
     p.append($('<a/>').data({i:i++}).text('['+(i)+']')); 
     cc=c.clone().appendTo(o).append(item); 
    } 
    }while($('#paginate').first().children().not('.part').length>0); 

    if($('.part',o).length<2){p.remove();return;} 
    $('.part',o).not(':eq(0)').hide(); 
    $('a',p).click(function(){ 
     var _this=$(this); 
     $('a',_this.parent()).removeClass('current'); 
     _this.addClass('current'); 

     $('#paginate>.part').hide().eq(_this.data('i')).show(); 
     }).first().addClass('current'); 


    return; 
}); 
      </script>

這是外部的列表更新...

$(document).ready(function() { 
    $newItemField = $('#newItem'); 
    $addButton = $('#add'); 
    $('ol').sortable(); 
    $('li').append('<span class="delete">x</span'); 
    $('ol').delegate('li','mouseover mouseout',function() { 
     $(this).toggleClass('hovered'); 
    }); 
    $('ol').delegate('li>.delete','mouseover mouseout',function() { 
     $(this).toggleClass('hovered'); 
    }); 
    $('ol').on('click','li>.delete',function(){ 
     $(this).parent().remove(); 
    }); 
    $newItemField.keypress(function(e) { 
     if (e.which == 13) { 
      addItem(); 
     } 
    }); 
    $addButton.click(function() { 
     addItem(); 
    }); 
}); 
function addItem() { 
    if ($newItemField.val() !== '') { 
     $newItem = $('<li/>'); 
     $newItem.text($newItemField.val()); 
     $deleteButton = $('<span/>').text('x').addClass('delete'); 
     $newItem.append($deleteButton); 
     $newItem.css('background-color','#e4ffef'); 
     $newItem.appendTo('ol'); 
     $newItem.animate({backgroundColor:'#FFFFFF'},5000); 
     $newItemField.val(''); 
    } 
}

我有凡我有一個列表的任務通過輸入並將其放入其中的偉大工程的OL進行更新，並將其與paginat的偉大工程e但將項目放置在seond頁面上。

有什麼想法？

來源

2014-02-19 user3328557

這是因爲ol元素是paginate div的第二個元素。請看下面的內容（你可以看到一次它呈現）。

<div id="paginate"> 
    <div class="part" style="width: 960px;"></div> 
    <div class="part" style="width: 960px; display: none;"> 
    <ol class="ui-sortable"></ol> 
    </div> 
    <div class="part" style="width: 960px; display: none;"></div> 
</div>

因此，放置在代碼下方將會發揮作用並按預期工作。

$(".ui-sortable").appendTo("#paginate div:first-child");

現在，它的工作... http://jsfiddle.net/iashu/Nty7M/

來源

2014-02-20 07:55:05

那是輝煌的，我怎麼設置這個限制，因此會打擊比如說10，創造了新的一頁？ – user3328557

jQuery的分頁將第二頁上的項目，並沒有限制列表中，這樣不實際分頁

回答

相關問題