jquery+ajax分页

先看效果图：

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA00AAACeCAIAAABhI3ZnAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAgAElEQVR4nO3db2gk553g8V8fc3uEy7HL+YiPDecWi+U3GmnihR6zG/CMTDUchjh6YwcxsIYWB5czi7SwYBB3Cis2grxaiWU2hqX72BdCsf1GNwFzIN0MY9gFd3MkI40OYoWgzhLf2WAuWRyO5QK1L6q7+ul6/tRT3dXqrurvh2FoPf38rVL385vnqaqphGEoAAAAKJ1/Nu0OAAAAYCKI8wAAAMqJOA8AAKCciPMAAADKiTgPAACgnIjzAAAAyulGLrXsvfsol3pm3Mk7u/X/uDPtXgBAOfEdWxrzcyq3v7U67S6kyCfOkyIMdXwn7+zOwzABYCr4ji2NOTmVhVjkYt8WAACgnIjzAAAAyok4DwAAoJyI8wAAAMqJOA8AAKCciPOAAqtUKpVKxSdPpF6vVzTX01Vgrhg/XP4fWP1H/ZM7J59f/2E6ctqO3jwcw6LEeZ2thUqlUm+JiLSSM9XCVmfa/QOmK/WbKwzD+IXxNQAHd6CgfugSr1utlpoh+sT5xxlx/lAz2QHPmFwis/n89itKnKepbrZ7v+rNoHtwuxcCAnMqdQ6oDK8QiBL5AUhl/Hz5JDYaDTU9Uad/0/kNpZBs32+2ONsRDsah8zV0exYUNs4baJw0A5HTXRb1ME8S32up+eNvRv3bcEI9BErGM6TQ1/NGqzl+sbW1pa8d+lQ7D9xxdpRi+9LL9BVaXCWI80Qa64FI9+J82v0Ark/8LRYEgVg2ldT86o+bm5usEACjSd37i1Ki7VoRidfzHP+yMgYrjmw5DWV2jbBK52A8X6lHuzRKEedFLs9Y0MNcib/v1G//arXq+NftyclJXJb1AGAEevBhfHdjYyNKiT5ozWYz+jGx53gNHS6uUJPIYPyXrfufu45zV1a5/f+2AKbi9PS0UqnY/j06J19kwLVRr+7Sr/RK7BVGP8Yxn15VYuvQvbDExzkhcbhSj6H73JVVidbzFldq0+4CcG0qlUq0QhAt4Knrc+q/U302gwD4S10TSmTwXDiPd3vdeeZk39afbVnO59TMQ5AnJVnPax2dilSXlqfdD+D6ONYJorAvXuSLI0LpP50hSonKMmcAmehrQrYMQRBEV0rY1vPglmMcpm+Xz89XXwnW8zpbu6ciwc4+y3mYU5Xhy70d4n2iRqMxP9sWQC48PzKJxXXHEl2iqlB5CIst/5ysQulX5jmu0vPhvowv177PnMLGed2D270TdPtANtvhSfoUB5SU/t3n+DbUb9GYeP+AskhdzEv8oysMw2gxzxjA+X/69FjH5991xVVRni8t2n8KYszv3pDVw8QxA8cCKUqcV9u/CsNeMNc4Sfy+X7GUB5iXGdQtWvF4/AoAI/XzEkd7+kcpmpTUmENM8VwcXqhxhv/nsdyfXH3PQX8RZ/ZZ8zN+483P12Aprs8D5pX6dWb8V2mUWO5/+gPXQF8y98/sUyRTqXIvQRm/1vQXI1Qyn4qyngcAAIBsiPMAAADKiTgPAACgnIjzAAAAyok4DwAAoJyI8wAAAMrJ+t+fZ7L37qOTd3bHrwcAAKAoHj16NO0upMjt+XmzP9Txra6uzsMwAWAq+I4tjTk5lXvvFmCM7NsCAACUE3EeAABAORHnAQAAlBNxHgAAQDnldh8GoKq88nH48IUx8+gZjCm24sbKfRp1V+UztBHaTc3j2a7e/7iUWoOxtqise7Bx/bbO+PfTdoLUnieGM2aj/nL5BfbMAwCTQ5yHiYhm6DFnuEQltgpTw4WsHXOHknENjiaMHfAMWRy9invurioRqKXW7BO62dpy99NYlU8Nxl7ZxhKfDp/+6w3Z8hhH7QhPjXEzQR6A6SpMnNeqVzZO+z9UN9tX+zUR6Wwt3D7oiohI0AxPGtPqHUT8ZspEHkcAEb+l5tEXnIztZurYCBVG+VMX+dyLc8a2bAdEzZ9o3TOSc3TGFpg68iQq9AySEm9lCh9t1APiGKZt8dKdZxw+q9G4JspMoUwV5tSeVr1ytJ6cVDpbC6/L+9Hsk8hmmYwGJQZzmHGycnam11J/DoxnQFtqWrVppWZf4kyMcILnSZiH7/7gYS712LU3q9XNdiKxGUjQjN8XPUPO7t69O9kGCk5Wf5Ipj+21u7ZEetZGs77ryVFJ/JYxj/8BUdP1v9UMiT96zsRbxiJ6NluL7uH7DNY2QL17qe2mHmRborEqvVHP8+X524uEyXzHNgOJp4pmIP2pohnEk4aao//zcEoYzTKSmGf6M5N1Muq90d6sql0wzma2zsS19hKVBsypadWmlsrDJKdL7UyYj17aMc3D5IOfHBRlPe/8oru4Pvxvjs7W7ml1bS/6obZ/Fe5PoV+YAamX6DnWq8KHL3jucibWz/wXZnLZwo6b9qknHq9jccu4Lqjv/6o71PrfI2w9Z8qfKGVb2VV7Hvc26xqtMVvqJQHGatVDZHyXVb3r1TgJ45Wcxt7m7u2Lc5Fa6+i0urZXi1NfP+uI1HprXdUgqJ4qVUQrQ0EQdC/VmjuHx7L2fq2z9bplMmodnQbrJyKti251aTlKW16qdi/ORdQJzdYZpaFusNPoNbATHBydi9TMqWnVSlqpmWY6E+ajl3ZM50dB4rzO2WX8Iek7v+hW1+7N5VkrttRpMiv/q7J85v5MNwd43krif+eHzx60z7X/6ovx7xVQA76Rw9ZMu+eprTgye17EmXrR3sh35Ixwow+uXefsUoYWD+LYa70ZnjQ6WwunF0r2lZ122Ki16hX1P/jshXlyvm2ZjPph3lBsd67EfCmdadUru0vtq/2aVubyrGOo6TIKcPqlzNWKuZT7cM0O/UxYhmk9wXOnIHHe+UVXLl+vRDvt0fUEnbNLkaXzeP99rnffC8V2+6ee039G9LzWKtMUmzWaMd7NkOm2D/cBiYM2z8sHPWNQ45V2thSfK+HcvRqBY2HM+OMsrJb5LAxjGlrbB92g2RDpDCXXVhblOAp3Gg3DRFIzJfb3mTqHlslosEBR279qby1UKhvR21fOuWrQGXUlUtGPGs2ptlL9alfMpVw9miHmM6Fm6A1z2ZhamHHmqRhxXufsUrqLO70PR6teqbfCPRHpHuxKOwxrUeLC1nIRryeF2ThhhM/9lblzLBaOf+eBun+aGuqlruc51vkSq5VxijHuzHo8R4t+wuEbjd3rdp5BoWcnE7Gje8iJd8f/lwZy16pvnAZNYxQ0Sm291bqOmCej/nJflLa7pLx/VsibH1BMxYjzhq++W16qbhy1TtYXpbr2fv+z0lgPNnYPO/s1PjuzboR928RCV74rQ7mvMxmrdXTb54A4rpxzbx3ahpxo1JhfzZYIdEY+C+NEP54rlJ7t+uzbsvZWJp2thY3LzbZxLU3b+vOpr79aV1sxT0aDy8rVS8WksR5sbGy39q0bUKmd6e/XnhtTHf01VJtWqnDiYR4aU+dRQf8/jOrSsiwvVZWUztmlLK7M6Vksluh6tXgHUP1Rj3j0FSzbala05mRcedKbVhtNZIhrU9exjFGCfxCghkfGLWafA5KpIb0JR6nUVSi15+4jnIuoCZ/tb7UztrGPvO4YDt+AgkJr1Su3j9eUVbTaymJ0YVpf1minc3gsvYvyzJNR6+g0WPdbOkztjLZTu7hSs6WmVZtWqnDMwxz7BJdHMeK8Vr1Sqbd6P/Q/XbV7a3Kw3U89v+j6fqQwRSMvkKTGPe4ALqLGgrZ4RQ0yoqpswZlPtxMhS1xh1nr0ao371Gqc6h+Q+cRwiUh0hD4nOuY4C6HpJmhjfK+eoLzW3txb5IluO0bhM1Jci87WQmXjMvmcuMZ60D0+jOKA1vZBN2O0o4R55slIDfMa68EgtOqcXUpytkrrTO3eWvX0qNUbzu5pbyHRmJpWbWqpwjEfvTFPcJnk8nSWa3iETPQ8IxEZegpO9BgdkeRDjSaD5+c5jPZgMMeT22x5Uhv1f9aasSFHV1M7rz98zr82W516KeMD8xyD0rPZDrWtiGOYjrEYR5ea7j7F7kPqf9JtQ0hNdPB/OiBsJvIdO5gmZHi6UGYV7eFq6gPvBoafyDb0fnIySj7zVemF8UFuxs4o7amjGFRsTFUf0Ges1lxXviY8XSYeQmg+la4TnJNCPD+vEoZhaiyYau/dR9vfWh2/nhm3urr66NGjafcCAMqJ79jSmJNTWYjgpxj7tgAAAMiKOA8AAKCciPMAAADKiTgPAACgnIjzAAAAyok4DwAAoJyI8wAAAMopt+fnnbyzO349AAAARTH7jwm8kVdFsz/U8c3Jgx8BYCr4ji2NOTmVe+8WYIzs2wIAAJQTcR4AAEA5EecBAACUE3EeAABAORHnYVIqr3zs+DFTPe4/qU17vqvX5tlnPZtnrxz1p450hOM5wmEZ7Uj6Z8iaU83m2bccO+nOP/JvOABMTm732wIOlVc+Dh++YEy3FVHzx6/1eow1hA9fsLXoKGjLn5oz0Zyt6dRscUNRevR3nM0zvFDrV9s1NpFIjF6o+fXa9IYcfE5EQqaGHP00DtDnvIzcmZGLAMDkFGY9r1WvDCxsdUQ6WwuVYQtbnWl3EwaJ4EZ9K3z4QhzTqH8SeRyVqzUnlr7cy35qLBU3aosa1R4mhqY3l3it5jRmM3bJLRGX2I5bnJI4zvoA9YOfyKm+a6xEPybGE5E6NFt/RPtFSh21I5vnb4v/qNUOiOWMYGrU2aLecqf2tOp6mnS2FhLTTJxNqUwtNygxmMP0etM6M1xenerMqWnVppWafYkzMcIJnidhHr77g4e51GPX3qxWN9v295uBSNCccCfu3r074RZKRVZ/Ev2t/zHmtP1oq8RYlbG4sapEJxMFE00k3koZuaVdn3S1Y7bBGjvvqC310OmvHWN0HCVbbalHwHaoje06mjOOInVEPtyjzv23ZW5N5jtWnR6agUhvLmkG/VfaBNIMRLQppb1ZlbjwIK262Q7DZhDnbm9WlUy9N9qbVbUL+mzm6Excay9RacCcmlZtaqk8THK61M6E+eilHdM8TD74yUFR4jzlU2R+d/JRHnGeN/fM7Y7zPCMMd+s+GXwCRz200uv3CZ4cvUpt0fjCFmS4j6RxOGqKLXCx5fEcgq1RWylbdOsYtU/P3e3asnmO2vYWcV4m1/AdGwc5Q+GWspLQDESkGgRVdVKJIosgSIRovWL2aKk/c6mNqTGfks/YGa3XQ7WaU9OqTS2Vi0mdStOZMB+9tGOai0LEeQXZt+2cXVaXlm1vbu2eVjf3GtfaIzioW11RirojlnohlO22A/dlaonMqfdqiLY/6HPln7uerAX1bvsUt21W6gdW3yA2Hli1XeM1gsZq1cv4bGMRbZ/aPbTEcPSN40Q2Pd34u2frqr797R6RuyqfoWFmdM4uZXGlNkjoXpxHL9abYXi1tzScfWWnHYYn64k6Do9l7V5Nzi+61bV7NdG0jk6D9YaILC9V4/rPL7rJ6czWmVa9t6+qlbk869hSB6XM1VpKFYV+JszDtJ/guVOQ+zDOL7py+XrloCsiUt1sX+0Pzl5r+6AbNPcNnzHMADU+swUNnhf+u28mUKVGbLYJ2xgqRaFDXMSYx9iNrNlC7UYNd/9Ta4vLOk5BIh5KHYXYD3uie2rTPvWPnyHOZuyJsT/6NX+2Vvyvm3T/tmCqovmiITIc2tRWFuX4rCNSk0bDsGZQMyXK+UV3cb0mncNLkaXzrYXb0RQVNMOThoi6QFHbv2pvLVQqG9HbV85liUFnGiehKacaNeqptlL9alfMpVw9miHmM6Fm6A1z2ZhamHHmqRhxXufsUrqLO70PR6teqbd6nyOR1tGpBE0W82aVf+igz7jGesacOxOTfeKaffW1/zzts5KXtc+O8epRS2oE6Q6RE++OH5rYbp5w980nmz5q29gTIVeiLVGWAxPneoThE9UVRau+cRo0jVHQKLUdnQbrJ1HI2D3YlXYY1qS3nLZ8tV/rHB7L2vu1qOHK7pLy/tnQYgUwScWI82r7V+F+/NPyUnXjqCWN/j+YJNghzJtZieApemFbLxl/vkwtm1g7tC03Gte9fDads3bScyNb7ZV7Tc7YintJ1f3umFJPqB6qGo+nY9SqxK+Q+qNj+GOOPdNvC6als7WwcbnZNq6ldc4uZXE9W+QVr9bVVhaluvZ+P3BrrAcbu4ed/VpvuU9EWken1bU95f2N7db+iW3eSu1Mf+f13Jjq6K+h2rRShRMP89CYOo+KEedp4t/LzuFxt7pWpl/SUjFOt8YMEVsevVr1xzFnaM9FLEes4LOepxZPrB4l6ozzqD8aK3R3W41vEqX0bmdaLo2b9oxmRl7LdDStpxuDYNtB1st6rjt6jpoVvlnTqlc2LtVLfrSNvKzRjrJat7xUVd/ohRSt7Wi5z0NqZ7Td1ejKM3NqWrUppQrHPMyxT3CJ5HI3x6RvORm6n3bovhnjHeqTwv22njwftKG/5fMIjBFuyHU36ijreb9t6utQu23TmKjf8GvsWKbD63k/qftFXJX/oBzpRu4TkToWn98rnzptN1PrlXO/7SRM5ju2vVlNPg8lDFMeu2G6KXaoyNBENJS7dwfr0I2s6g/GqnmuSjbDUz/PVXEqRpwX9p9nJCKSvNmdOG+m+UyHtvnVs0JHQ46afRpNndFto3CHYsZnfxh7nprZkS3RGXdtxiDbP+B2hzjuwYamQ5d6iPScet/8IzzPt0Ln8fH5bYHbRL5joydxqAYP0DNNK3EhZ5yXfB7JoJUoR/JBHkovjAGHsTPDcWWy/7ZUNQYyVmuuK1/XGudZTqXrBOekEHFeJQxDv4U/l713H21/a3X8embc6urqo0ePpt0LACgnvmNLY05OZSGCn4I8Pw8AAAAZEecBAACUE3EeAABAORHnAQAAlBNxHgAAQDkR5wEAAJQTcR4AAEA55fb8vJN3dsevBwAAoChm/zGBuf3/trM/1PHNyYMfAWAq+I4tjTk5lXvvFmCM7NsCAACUE3EeAABAORHnAQAAlBNxHgAAQDkR56HMKq98PGaG0VrxqdazaXe2yisf63/GbNGnUc961Py2UlmP3oRG4T50AFBQud1vC0yaYxoOH76QyJlIcdQWvQgfvqDWn1o80XrUolrDyLUlOhlX7mg9USS1n+M3amzLnd9WZyLdp93Uzqi1OfqWyzkCgFlWmPW8Vr0ysLDViVI7WwvJJJRW+PCF6I/6euTpWa0hrmTkChO9MvZQjSzjJS7bIlyUGFc18mqTvtTnXvxLNJo6auOJ0OPdROt6PcbXxlHoPyb6o7ZrO6HqMInwym8wU1Qq9ZY7tadV19Oks7WQmGribEplarlBicEcpteb1pnh8up0Z05Nqzat1OxLnIkRTvA8CfPw3R88zKUeu/ZmtbrZTiQ2A+kntjerEjQn3Im7d+9OuAV4kdWfOH6MUox/bKWi13GKXqF/xzwbdTSRKJV47TN224+ZMtsyGMdlHIXtha1Cx3Fzd9LRkK2qvM448jWZ79hmIPH00AykP20oE4iao/+zJKeU9mZV4sKDtOpmOwybQZy7vVlVMvXeUGcopd2hFm2diWvtJSoNmFPTqk0tlYdJTpfamTAfvbRjmofJBz85KEqcp3yKYkOxnfGjkzPivBnhjk7ckY2eMzHZ26JGdz22uMEdlKRGe6mhTy4RUugcoy249GlaTfTsmH8EaUxXmzO+Dp3nC9N1Dd+x8bwxNGcoKwnNQESqQTC0dBBFFkGQmGd6xezRUn/mUhszrUrYOqP1eqhWc2patamlcjGpU2k6E+ajl3ZMc1GIOK8g1+d1zi6rS8uJxNrKohyfdURqIp2zS1lcr02lc5ghnld3JS7OG/MCfJ8tzkTrPp30ufAu6yV0tj3T6G+fJvQr3mzDia/z0y+FdPfZPQQ9xVhhPCJ9T1k9X/oLtnHngzZndC/ORWoist4MTxqdrYXTCyX7yk47bNRa9Yr6H3x2Do9l7f2anG93q2v3DPNP6+g0WD8RkeWlalz/+UU3OZ3ZOtOqV3aX2lf7Na3M5VnHUNPlWUekFpcyVyvmUu7DNTv0M2EZpvUEz52CxHnnF125fL1y0BURqW62r/ZrItI4CaVeqVSitPBkLs8ghnhO0o6r8vXbBTJN/Hrc4J/N/44K/V091lQDONGiMdstEY53E62nHhb1qkfPIu56xCMa0++JSQSXiYJj9g1F09o+6AbNhsjwVWnKqkGj0dCL1UyJcn7RXVyvSefwUmTpfGvhdjRFBc3wpCGiLlDU9q/aWwuVykb09pWpNkNnGiehKWc/ajSn2kr1q10xl3L1aIaYz4SaoTfMZWNqYcaZp2LEeZ2zS+ku7vQ+HK16pd6K/sF1+2InDE8kut6yvtP7cGEuOKZ8432v7igql2k+sSrmiEXiPoxzI63jrlJ9GS+XASZuxR3zPlnb7cmOU6aGcam3947WK5RYq75xGjSNUdAotfVW6zoi0j3YlXYY1kSkVa8sbC1f7df6y31R2u6S8v5Zb7ECmLxi3G9b278KBzHc8lL19KglncPjbrDeS6zdW6ue7hbzxiGMxnG/rfG+10w1qDLd6+q+X9W4jGer3Hhj7MhbzIlKjMFx6j2t7qjUtkdsu9nWdpqM50VfZM203unOGdc25g4+Zllna2HjcrNtXA3onF3K4kq2yCterautLEp18/1+4NZYD7rHh9G2aq/O1tHpYGO3sR50D7Ydt3+mdsaw82tNTas2rVThmIc5ygkujWKs52mqS8siZ9PuBUpntAvI1OJ6LKKveLmzqenugv70p4048ng25M6jvuvuvM8esbHPcXBmG10idButdZRDq17ZuNxUVtG0jbys0Y6yWre8VFXf6F0Y1truXZyXLrUz2u5qFLOYU9OqTSlVOOZhjn2Cy6MY63mtuvL0m87hsazdq0nt3lr18qy/gnd+YbkQFrAxrlcZ44mRL/vTr/OzhXTGlST1kkG9oN5/PSXxVjSWTCuUNuNc3pe1IccOeOIIq8Fl6oKuDAeLLOaVVGdrIRHkiSjLbhJdtZcx2ulPRCIitXtrMlihO7/oBuuNaFe3MWgrvqCuc3Yp8TuenandW6ueHrV6w9k97S0kGlPTqk0tVTjmozfmCS6RYqzn9W+42BCR6CLXmojU9q92erdhKDdnoJxse4KxxLVxtpzGGyzGnOATF/7rdfo0atxIdS+J+VyfZ1zNMl5dp7fu7p6toJ7Z0ZnpLqepO+xxBDytzmBSOofHXRE5uF056KVE00VjPdjY6Cdmvmqvdw9GRL3NQqqb7auGdLbUh0Q0TtpnC+oUlmzM3Jn4zlmp3Vur3t4YtBDNdubUQSlzteZSRWY+euOd4BKphGE4fi177z7a/tbq+PXMuNXV1UePHk27FwBQTnzHlsacnMpCBD/F2LcFAABAVsR5AAAA5UScBwAAUE7EeQAAAOVEnAcAAFBOxHkAAADlRJwHAABQTrk9P2/8SgAAAApk9p+fl0+cBwAAgFnDvi0AAEA5EecBAACUE3EeAABAORHnAQAAlBNxHgAAQDkR5wEAAJQTcR4AAEA5EecBAACUE3EeAABAORHnAQAAlBNxHgAAQDkR5wEAAJQTcR4AAEA5EecBAACUE3EeAABAORHnAQAAlBNxHgAAQDkR5wEAAJQTcR4AAEA53Zh2BwDIXx9/Mu0umP2Htd+VMboXFa9U/my04mH4nXFal5z6P63ikxZ1D0C5EecBM2EGJ101QBmhe2rxlf/0YtbiZ3/1o3Fal1z7f/3FJ21mo08A+WLfFgAAoJxYzwMK4NZbD57cf23MGtwZxqwfU8TJBWBDnAfMhcRMP37g2PP4w/oH8l++9/LLGct940/+/Z8//1vR61/+9Ed3/uLvM1bw0ZtvffpjERH5ys3fO/n2zYzF1Xo+r77x6u6dbMU+/P4Hf/z0N/2fvrR5v97IUjzfyGxSJxdA8RHnAXMnzyDvvV9+9uXfyVzwpa//6fO/JZ91b/3ZE3np64//6MXHfyJZQr2nO29/+snN33vy7ZsiH7351s/efO/m37yRuRci0tr79Mdyo5q94E//72++due10RqV4cgs37CMIA+AijgPmBfqGlJiPWmEyCBa0PraV7/02a+yd+Wjv73zUfz6i3/4o2ee+7fPfUP+/oe+5W/ufi9ewHvpzlcfHH3+VCT7kt7jD49+deMrmYuJyNOrX92oPjtKyQnJ9+QCKA3iPKAYcpm8jaVS9xDNnnnmL++/9PJ7J7f+5yilB+79m+fGKf74w6Nf3PiDr4+wb/t054Mv/uDVZ7rvfZ697K+7X/zzOxm3et3GX4fL8+QCKAviPKAYZm1V5uU3Xsqjmls//MN/KSK//D8/917MG2jtPTj4hchXn816dZ2IyHv/+7/99jNP7sib72Uv+/gfP/ny/z9668GBiIiMs4Ebe3L/NbZcAeSOOA8ottGu6J+NkOLWD+9XnxMR+fXDzPdhiIg0tl9riLT2Htza++jJdqa486M3H8vm/ZdEPkrPq/v0Hz/7Qr75xmu7d0Tk6c7bH+w8m/lODp0e6hX55AKYCcR5QLEVdkb/d//1e1GQJz//u/8x4v+YISIijee/dPD4H1oi/ne8fvj9zz+5+VymO2SHvFF/MljAu7nw2z87+l9P5c7I9/wOJEK9wp5cALOCOA/AFHznOy/+/pdFRH7+dw++cTh2dV/+F89nyP309Oo3n33xs1tv/Sz6+cfvPeh+Otbe6+8+k0OQBwC54//DAOZFvDgUrRjdeutBtC04hUWjl77+yldERH750x+NFOQ93Xn7QXxdXeun/+8rC/86ywP8bu5+77Un96M/z35NbnzzjWxB3off/+DW2x9+2Pvpo8e/+NKdsa/Pi415h830Ty6AWcJ6HjBH1Lk/+nsq0cA3/vBfRc/c+53nX3xy/0URkS8+/89v/22W56r8+s23Htx6LCIiX332yejPSR7Fy99+9S+//8Ef9y6eu/HNN14dfQs4PzNycgHMFOI8YEYlrsHXL8nPNH/bpvw4IBgxGuchHRAAAACcSURBVBi6Us3XD//iv49wd+2wl/7m/rhVjFPPy99+9Uku7edhUicXQPER5wEzKt+52V0bccAUjX/wObkAbLg+DwAAoJyI8wAAAMqJOA8AAKCciPMAAADKifswgJnw18efTLsLLmN27+yvfjTF1sevYbrFAWBklTAMp90HAAAA5I99WwAAgHIizgMAACgn4jwAAIByIs4DAAAop38CFmqAxKvcoA0AAAAASUVORK5CYII=" alt="" />

实现原理很简单，使用了jquery.pagination这个插件，每当点击页码时异步去服务器去取该页的数据，简单介绍如下：

一、数据库表结构：很简单  就四个字段 分别是News_id  News_title  News_time  News_readtimes

二、前台页面代码：

    <head runat="server">
        <title>JQuery无刷新分页</title>
        <link href="Styles/common.css" rel="stylesheet" type="text/css" />
        <link href="Styles/paging.css" rel="stylesheet" type="text/css" />
        <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
        <script src="Scripts/jquery.pagination.js" type="text/javascript"></script>
        <script type="text/javascript">
        var pageIndex = ;
        var pageSize = ;  

        $(function() {
            InitTable();                

            $("#Pagination").pagination(<%=pageCount %>, {
                callback: PageCallback,
                prev_text: '上一页',
                next_text: '下一页',
                items_per_page: pageSize,
                num_display_entries: ,//连续分页主体部分分页条目数
                current_page: pageIndex,//当前页索引
                num_edge_entries: //两侧首尾分页条目数
            });  

            //翻页调用
            function PageCallback(index, jq) {
                InitTable(index);
            }  

            //请求数据
            function InitTable(pageIndex) {
                $.ajax({
                    type: "POST",
                    dataType: "text",
                    url: 'Ajax/PagerHandler.ashx',
                    data: "pageIndex=" + (pageIndex + ) + "&pageSize=" + pageSize,
                    success: function(data) {
                        $("#Result tr:gt(0)").remove();//移除Id为Result的表格里的行，从第二行开始（这里根据页面布局不同页变）
                        $("#Result").append(data);//将返回的数据追加到表格
                    }
                });
            }
        });
        </script>
    </head>  

    <form id="form1" runat="server">
        <center>
            <table id="Result" border="" cellpadding="" style="border-collapse: collapse; margin:20px;
                border: solid 1px #85A8BE;width:%">
                <tr>
                    <th style="width: 10%">
                        ID
                    </th>
                    <th style="width: 60%">
                        标题
                    </th>
                    <th style="width: 20%">
                        更新时间
                    </th>
                    <th style="width: 10%">
                        点击量
                    </th>
                </tr>
            </table>
            <div id="Pagination" class="paging">
            </div>
        </center>
        </form>  

三、页面后台文件

这里主要是获取记录总数：

public string pageCount = string.Empty;//总条目数

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                pageCount = new News().GetNewsCount();
            }
        }

四、最主要的是ajax处理程序：PagerHandler.ashx

    public class PagerHandler : IHttpHandler
       {
           public void ProcessRequest(HttpContext context)
           {
               context.Response.ContentType = "text/plain";
               string str = string.Empty;
               int pageIndex = Convert.ToInt32(context.Request["pageIndex"]);
               int size = Convert.ToInt32(context.Request["pageSize"]);
               if (pageIndex == )
               {
                   pageIndex = ;
               }
               int count = ;  

               News n = new News();
               List<News> list = n.GetNewsList(pageIndex, size, ref count);
               StringBuilder sb = new StringBuilder();
               foreach (News p in list)
               {
                   sb.Append("<tr><td>");
                   sb.Append(p.News_id);
                   sb.Append("</td><td>");
                   sb.Append("<a href='#'>"+p.News_title+"</a>");
                   sb.Append("</td><td>");
                   sb.Append(p.News_time);
                   sb.Append("</td><td>");
                   sb.Append(p.News_readtimes);
                   sb.Append("</td></tr>");
               }
               str = sb.ToString();
               context.Response.Write(str);
           }  

           public bool IsReusable
           {
               get
               {
                   return false;
               }
           }
       }