首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Cordova警报按钮

Cordova警报按钮
EN

Stack Overflow用户
提问于 2016-07-04 16:13:07
回答 4查看 681关注 0票数 0

我想在科多瓦的一个按钮上放个警报,我不明白为什么它不起作用。我用控制台启动了一个新的cordova空白项目。请参阅下面的代码:

index.html

代码语言:javascript
复制
<!DOCTYPE html>
 <html> 
    <head> 
        <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 *">
        <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"> 
        <title>Hello World</title>
    </head>
    <body>
        <button id = "textlocal">Test Local</button>`

        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
    </body>
</html>

index.js:

代码语言:javascript
复制
var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
        document.getElementById("textlocal").addEventListener("click", textLocal);

    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    },

    function textLocal(){
            alert('test');
        }
};
app.initialize();

可能我的textLocal()函数不是在正确的位置,但我无法理解如何修复它。非常感谢您的耐心和帮助。

EN

回答 4

Stack Overflow用户

发布于 2016-07-04 16:20:07

您的代码中有一个JavaScript错误。请现在试试这段代码。也许您需要将"textLocal“侦听器添加到"deviceready”侦听器中。

代码语言:javascript
复制
var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
        document.getElementById("textlocal").addEventListener("click", this.textLocal);

    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    },
    textLocal: function() {
        alert('Test');
    }
};
app.initialize();
票数 0
EN

Stack Overflow用户

发布于 2016-07-04 16:39:14

您的代码有语法错误。

如果您不与按钮相关联,此函数将永远不会调用。

您需要放置一个onclick侦听器。您可以像这样使用onclick标记:

<button id="textlocal" onclick="textLocal()">Test Local</button> (无空间)

或者使用jquery

$("#textlocal").on("click", textLocal);

票数 0
EN

Stack Overflow用户

发布于 2016-07-04 17:22:38

从head标签中移除这个,然后尝试

代码语言:javascript
复制
<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 *">

如果仍然不能工作,则在加载DOM之前执行您的deviceready函数。因此,如果您正在使用jquery或只是在onload事件中,则应该将其放在$(document).ready中。顺便说一下,添加addEventListener并不适合这样简单的操作,只需使用onclick侦听器即可。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/38188828

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档