Question

我正在使用turn.js来建立目录。我使用PHP从数据库中获取页面，并且想要进行一些控制按钮，例如搜索特定页面。我如何从搜索框中解析值以在$("#flipbook").turn("page", 10);处代替数字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>

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

Answer 1

如果将页码传递给下一页，则可以使用$_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>

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

1 个答案: