Question

我正在使用javacsript和jquery构建一个phonegap应用程序。我编写了这段代码来刷图像。

$('#fullscreen').swipeleft(function () {
        //Show next image
        showNext();
        alert('Left');
 });

function showNext() {
$("#fullscreen").attr('src', "images/next.png");
}

但是当我滑动时，图像不会改变，我得到错误＆＃34; 09-13 14：49：21.188：W / webview（20238）：因为我们正在等待WebCore＆＃39;对降落的回应。＆＃34;

浏览完一些论坛后，我添加了以下代码。

var fullScr = document.getElementById("fullscreen");
    fullScr.addEventListener( "touchstart", function(e){ onStart(e); }, false );
    function onStart ( touchEvent ) {
      if( navigator.userAgent.match(/Android/i) ) {
        touchEvent.preventDefault();
      }
}

但它仍然无法正常工作。虽然当我将屏幕方向从纵向更改为横向时，图像会发生变化。当我改变方向时会发生什么？我怎样才能让它以相同的方向（纵向/横向）工作？

提前致谢。

Answer 1

它对我有用：S ...我使用了Cordova的1.5.0版本并在Android模拟器4.0.3上运行该应用程序。你能尝试下面的例子吗？

HTML内容：

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">

        <!--  BASIC INCLUDES - TO BE MODIFIED ACCORDING TO YOUR CONVENIENCE -->

        <link rel="stylesheet" href="./css/jquery.structure-1.1.0.min.css" />
        <link rel="stylesheet" href="./css/jquery.mobile-1.1.0.min.css" />

        <script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
        <script type="text/javascript" src="./js/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" src="./js/jquery.mobile-1.1.0.min.js"></script>

        <!--  END - BASIC INCLUDES -->

        <script type="text/javascript" charset="utf-8">

        $(function() {
            $('#fullscreen').swipeleft(function () {
                //Show next image
                showNext();
            });

            function showNext() {
                $("#fullscreen").attr('src', "./images/next.png");
            }
        });

        </script>
    </head>

    <body>
        <div data-role="page">
            <div data-role="content">
                <img id="fullscreen" src="./images/previous.png"></img>
            </div>
    </div>
    </body>
</html>

注意：确保以下事项：

根据您的方便修改代码的“基本包含”的来源（jQuery / jQuery Mobile的CSS / JS文件的来源）
如果您的版本不是1.5.0，请更改cordova版本的来源

希望这也适合你。无论如何，让我知道你的结果。

在phoneap + jquery问题中滑动图像

1 个答案: