demo.html

<!DOCTYPE html>
<html>
    <head>
        <meta chartset="utf-8"/>
        <link rel="stylesheet" href="css/bootstrap.css">
        <script type="text/javascript" src="js/jquery-1.8.0.js"></script>
        <script type="text/javascript" src="js/bootstrap.js"></script>
        <script type="text/javascript" src="jquery.pagination.js"></script>
        <style type="text/css">

          body {
              margin: 50px auto;
          }
          .container, .main {
              width: 760px;
          }
          .main {
              height: 400px;
              background: #eee;
          }
        </style>
        <script type="text/javascript">
          
          jQuery(function($) {

              $("#page").pagination({
                  className: "pagination-right",
                  page: 1,      // current page
                  count: 30,    // page count
                  num: 10,      // number
                  refresh: false, // reflush
                  callback: function(currpage, newpage) {
                      console.log(currpage + " -- " + newpage);
                  }
              });

          });
        </script>
    </head>
    <body>
        <div class="container">
            <div class="main">
            </div>
            <div id="page">
            </div>
        </div>
    </body>
</html>