Monaca Javascript无法正常工作

时间:2017-03-19 07:11:00

标签: javascript monaca

我有以下代码,显示的简单js无效。如何让js在monaca工作?

这是我正在做的代码。

顺便说一下,我从配置屏幕添加了jQuery(Monaca Version)版本:2.0.3。

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
  <script src="components/loader.js"></script>
  <script src="lib/onsenui/js/onsenui.min.js"></script>

  <link rel="stylesheet" href="components/loader.css">
  <link rel="stylesheet" href="lib/onsenui/css/onsenui.css">
  <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css">
  <link rel="stylesheet" href="css/style.css">

  <script>
    //this starts the count down. 
    //time should be in seconds
    function countDown(time){
        $("#countDown").txt(time);
        var timeout=setTimeout(function(){
            time--;
            $("#countDown").txt(time);
            if(time==0) clearTimeout(timeout);
        }, 1000);
    }

    ons.ready(function() {
        countDown(10);
    });

  </script>
</head>
<body>
    <div id="countDown"></div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

从我在您的代码中看到的,您在将time变量的值分配给<div>元素时犯了一个错字。它不是$("#countDown").txt(time);,而是$("#countDown").text(time);

另外,从你的功能名称来判断 - countdown我猜你正在尝试创建一个出现在屏幕上的计数器。在这种情况下,您不应该使用setTimeout(function, period)函数,因为它用于调用作为参数传递的函数,仅在句点(作为第二个参数传递)传递之后调用一次。因此,您应该使用setInterval(function(),period)函数,该函数在每个句点过去时调用该函数。因此,您应该使用clearInterval()代替clearTimeout()

您的代码应如下所示:

<script>
    //this starts the count down. 
    //time should be in seconds
    function countDown(time){
        $("#countDown").text(time);
        var timeout=setInterval(function(){
            time--;
            $("#countDown").text(time);
            if(time==0) clearInterval(timeout);
        }, 1000);
    }

    ons.ready(function() {
        countDown(10);
    });
</script>