मैं बिल्कुल लिया है की जरूरत है:
यहाँ एक डेमो है एक ही समस्या। प्रलेखन को देखने के बाद ऐसा प्रतीत होता है कि टूल शब्दशः केवल पेजिनेशन टूल को प्रस्तुत करने के लिए है और हमें यह ध्यान रखना होगा कि हम डेटा को कैसे बाध्य करते हैं। सब से
पहले आप चयनकर्ता div के अंदर कुछ भी जरूरत नहीं है - कि जहां पृष्ठांकन नियंत्रण दिखाई है:
ताकि खाली छोड़ दें और अपनी सामग्री पैराग्राफ या जो कुछ भी में यह ऊपर बैठना है:
<p class="selection" id="page-1">one</p>
<p class="selection" id="page-2">Two</p>
<p class="selection" id="page-3">Three</p>
<p class="selection" id="page-4">Four</p>
<p class="selection" id="page-5">Five</p>
<p class="selection" id="page-6">Six</p>
<p class="selection" id="page-7">Seven</p>
<p class="selection" id="page-8">Eight</p>
<div id="selector">
</div>
012,351:
आप एक गतिशील डेटा के साथ काम कर रहे हैं, तो आप
तो मक्खी पर पहचान-पत्र उत्पन्न करने के लिए है कि बस से पहले शरीर अंतिम टैग के नीचे आप इस स्क्रिप्ट की जरूरत पड़ेगी
<script language="javascript">
$(function() {
$('#selector').pagination({
items: 10,
itemsOnPage: 2,
cssStyle: 'compact-theme',
onPageClick: function(pageNumber){test(pageNumber)}
});
});
</script>
नोटिस मैंने ऑनपेजक्लिक फ़ंक्शन (नाम बदलने की आवश्यकता है) जो मेरे फ़ंक्शन पर पेज नंबर पास कर देगा।
मैं अपने हैडर अनुभाग में इस मिल गया है:
<style type="text/css">
.selection {
display: none;
}
</style>
<script>
function test(pageNumber)
{
var page="#page-"+pageNumber;
$('.selection').hide()
$(page).show()
}
</script>
</head>
सीएसएस मूल रूप से उन सब को वर्ग द्वारा छुपाता है, तो समारोह किसी भी है कि वर्तमान में खुले हैं बंद कर देता है और एक तुम आईडी द्वारा चाहते खोलता है।
मेरे लिए अब ठीक काम करने के लिए लगता है, लेकिन यह इतना निराशा :)
यहाँ पूरे स्क्रिप्ट है था:
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="pager.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.selection {
display: none;
}
</style>
<script>
function test(pageNumber)
{
var page="#page-"+pageNumber;
$('.selection').hide()
$(page).show()
}
</script>
</head>
<body>
<p class="selection" id="page-1">one</p>
<p class="selection" id="page-2">Two</p>
<p class="selection" id="page-3">Three</p>
<p class="selection" id="page-4">Four</p>
<p class="selection" id="page-5">Five</p>
<p class="selection" id="page-6">Six</p>
<p class="selection" id="page-7">Seven</p>
<p class="selection" id="page-8">Eight</p>
<div id="selector">
</div>
<script language="javascript">
$(function() {
$('#selector').pagination({
items: 10,
itemsOnPage: 2,
cssStyle: 'compact-theme',
onPageClick: function(pageNumber){test(pageNumber)}
});
});
</script>
</body>
</html>
एक डेमो प्रदान करें: [jsbin.com] (http://jsbin.com) –
@Web_Designer http://jsbin.com/obacig/1/edit –