jQueryMobile的事件

最新推荐文章于 2019-03-21 20:30:43 发布

bboyjoe

最新推荐文章于 2019-03-21 20:30:43 发布

阅读量803

点赞数

分类专栏： jQueryMobile 文章标签：前端 jQueryMobile 框架

本文链接：https://blog.csdn.net/bboyjoe/article/details/48110235

版权

jQueryMobile 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

以下列举了jQueryMobile的常用事件：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>page示例</title>
    <link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.5.min.css">
    <script src="jquery-1.11.1.min.js"></script>
    <script src="jquery.mobile-1.4.5.min.js"></script>
    <script>
        //页面加载事件
            $(document).on("pageinit",function(){
                //触摸事件
                $("#p1").on("tap",function(){
                    $(this).hide();
                });
                //长按事件
                $("#p2").on("taphold",function(){
                    $(this).hide();
                });
                //左右滑动事件
                $("#p3").on("swipe",function(){
                    $(this).hide();
                });
                //右滑动事件
                $("#p4").on("swiperight",function(){
                    $(this).hide();
                });
                //滑动开始事件
                $(document).on("scrollstart",function(){
                    alert("开始滑动")
                });
                //滑动停止事件
                $(document).on("scrollstop",function(){
                    alert("停止滑动")
                });

            });
    </script>
</head>
<body>
<div data-role="page"  id="page_one">
    <div data-role="header" data-position="fixed">
        <h1>欢迎来到主页</h1>
    </div>
    <div data-role="main">
       <p id="p1">点击我隐藏</p>
       <p id="p2">长按我隐藏</p>
       <p id="p3">滑动我隐藏</p>
       <p id="p4">右滑我隐藏</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
        <p>嘻嘻哈哈</p>
    </div>
    <div data-role="footer" data-position="fixed">
        <h1>底部</h1>
    </div>
</div>



</body>
</html>

bboyjoe

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQueryMobile的事件

以下列举了jQueryMobile的常用事件： page示例 //页面加载事件 $(document).on("pageinit",function(){ //触摸事件 $("#p1").on("tap",functio
复制链接

扫一扫