如何获取用户想要的Turn.js的页码



我正在使用turn.js制作目录。我用PHP从数据库中获取页面,我想制作一些控制按钮,比如搜索特定页面。如何解析搜索框中的值以取代此处的数字10$("#flipbook").turn("page", 10);并运行它?

<div class="flipbook-viewport">
<div class="container1">
<div class="flipbook">
<?php
if (isset($_GET['eb_catalogs_id'])){
$catalogos_id = $_GET['eb_catalogs_id'];
$query= "SELECT c_catalog_name FROM eb_catalogs WHERE c_id = $catalogos_id";
$test= $conn->query($query);
$catalogname =$test->fetchColumn();
$query1 = ("SELECT * FROM eb_catalog_".$catalogname."");
$pages = $conn->query($query1);
$i = 1;
foreach($pages as $page){
echo "<div class='p".$i."' style='background-image:url(https://untuneful-carload.000webhostapp.com/img/catalogs/".$catalogname."/".$page['eb_catalog_imgs'].")'></div>";
$i++;
}}else{
echo "nothing";
}
?>
</div>
</div>
</div>
<script type="text/javascript">
function loadApp() {
// Create the flipbook
$('.flipbook').turn({
width:922,  
height:600,  
elevation: 50,          
});
}
// Load the HTML4 version if there's not CSS transform
yepnope({
test : Modernizr.csstransforms,
yep: ['js/turn.js'],
nope: ['js/turn.html4.min.js'],
both: ['css/basic.css'],
complete: loadApp
});
alert("The current page is: "+$("#flipbook").turn("page"));
</script>

这是到目前为止页面的代码。。我知道如何创建输入字段,但不知道如何将输入字段的值解析为跳转到用户想要的特定页面的函数。

如果您将页码传递到下一页,您可以使用$_post$_get获取它,并在页面加载时执行它:

<script>
$(window).on("load",function(){
$("#flipbook").turn("page", <?php echo ($_GET["page"]) ?>);
})
</script>

如果你在同一页上,只想翻书,你可以使用val():轻松获得号码

<input id="pageNumber">
<button onclick="flipPage()">GO</button>
<script>
function flipPage(){
var pageNumber=$('#pageNumber').val();
$("#flipbook").turn("page", pageNumber);
}
</script>

最新更新