cordova震动蜂鸣器输入参数

来源：互联网发布：porter robinson知乎编辑：程序博客网时间：2024/05/16 13:07

<!DOCTYPE html><!--    Licensed to the Apache Software Foundation (ASF) under one    or more contributor license agreements.  See the NOTICE file    distributed with this work for additional information    regarding copyright ownership.  The ASF licenses this file    to you under the Apache License, Version 2.0 (the    "License"); you may not use this file except in compliance    with the License.  You may obtain a copy of the License at    http://www.apache.org/licenses/LICENSE-2.0    Unless required by applicable law or agreed to in writing,    software distributed under the License is distributed on an    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY     KIND, either express or implied.  See the License for the    specific language governing permissions and limitations    under the License.--><html>    <head>        <!--        Customize this policy to fit your own app's needs. For more guidance, see:            https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy        Some notes:            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:                * Enable inline JS: add 'unsafe-inline' to default-src                <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">        <meta name="format-detection" content="telephone=no">        <meta name="msapplication-tap-highlight" content="no">        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">        <!--<link rel="stylesheet" type="text/css" href="css/index.css">-->        <meta name="viewport" content="user-scalable=yes, initial-scale=1, maximum-scale=2, minimum-scale=0.5">        <meta charset='utf-8'>        <title>Hello World</title>    </head>    <body>        <div class="app">            <h1>Apache Cordova</h1>            <div id="deviceready" class="blink">                <p class="event listening">Connecting to Device</p>                <p class="event received">Device is Ready</p><br>                <form>                <input type="text" id="inputnum" value="0">                </form>                    <button id='vibration'>震动</button><br><br><br>                    <button id = "beep">发声</button>                    <button id='dispbutton'>显示信息</button>                    <p id="dispnum"></p>            </div>                    </div>        <script>            var num=document.getElementById('inputnum');//读text地址            function beginVabration(){//震动回调函数                navigator.vibrate(num.value*1000);                           }             function beginBeep(){/发声回调函数                navigator.notification.beep(num.value);            }            function disp(){//显示回调函数                document.getElementById("dispnum").innerHTML=num.value;            }        </script>        <script type="text/javascript" src="cordova.js"></script>        <script type="text/javascript" src="js/index.js"></script>    </body></html>

功能实现，在text框中输入要震动的时长和要发声的次数，本程序为了简单就把这个数合并成一个了，其中红色部分是自己添加的代码,上面是HTML代码，下面是添加的js代码

var app = {    // Application Constructor    initialize: function() {        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);    },    // deviceready Event Handler    //    // Bind any cordova events here. Common events are:    // 'pause', 'resume', etc.    onDeviceReady: function() {        this.receivedEvent('deviceready');       // console.log(navigator.vibrate);        //console.log(navigator.notification);        document.getElementById('vibration').addEventListener('click',beginVabration);//这三个函数都是按钮的事件监听        document.getElementById('beep').addEventListener('click',beginBeep);        document.getElementById('dispbutton').addEventListener('click',disp);    },

震动按钮，发声按钮，显示信息按钮（用来输出text中的信息，查看读值是否准确）

调试出现的问题

1.按钮监听，两种方法，第一种如程序所示，在js中添加的红的代码

第二种方法<button id=' ' onclick=' 函数名 ' >按钮上要显示的内容</button>

2.读text值时出现的问题

第一次的写法var num=document.getElementById('inputnum').value; 结果怎么也读不过来值，不知道为什么，愿意待查

第二次的写法如程序中所示，先读text的地址var num=document.getElementById('inputnum');

引用时在读值num.value就是可以的

写的有点乱，

阅读全文

0 0