2015-08-08 84 views
1

你好伙伴开发者, 我是PhoneGap的新手,未编码多年,并且在下面的addEventListener中遇到了问题。PhoneGap/Cordova v5 addEventListener不等待点击的点击事件

即使用户没有单击该按钮,该事件被调用并且显示警报,但我正在JavaScript中的addEventListener中抽样的警报始终显示。我想确保只在按钮被实际点击时显示警报。

任何帮助,你可以提供将是非常棒的。

干杯 德瑞

var app = { 
 
// Application Constructor 
 
initialize: function() { 
 
this.bindEvents(); 
 
}, 
 
bindEvents: function() { 
 
document.addEventListener('deviceready', this.onDeviceReady, false); 
 
}, 
 
// deviceready Event Handler 
 
onDeviceReady: function() { 
 
alert("PhoneGap is working in index.js onDeviceReady"); 
 
var buttonTwo = document.getElementById("btnPageTwo"); 
 

 
// the below event listener is fired always, even without the user clicking or performing any action the alert is displayed 
 
buttonTwo.addEventListener('click', alert("Button Clicked"), false); 
 
app.receivedEvent('deviceready'); 
 
}, 
 

 
// 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); 
 
} 
 
}; 
 

 
app.initialize();
<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"> 
 
<script type="text/javascript" src="cordova.js"></script> 
 
<script type="text/javascript" src="js/index.js"></script> 
 
<title>Multipage Document Lesson 09</title> 
 
</head> 
 
<body> 
 
<p>First Page</p> 
 
<button id="btnPageTwo">Go to Page 2</button> 
 
</body> 
 
</html>

回答

0

您直接在添加事件中使用的警报。改用功能

buttonTwo.addEventListener('click',function(){ alert("Button Clicked");}, false);