cordova/phonegap onclick 不起作用
[英]cordova/phonegap onclick doesn't work
问题描述
I try to create button which starts an alert after a click event.
我尝试创建在单击事件后启动警报的按钮。 Something like that :类似的东西：
<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>
</div>
<button onclick="alert('salut')" id="boutonAlerte">Alerte</button>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script> </body>
but the problem is that my onclick doesn't work.但问题是我的 onclick 不起作用。 A lot of people tell me to try it on javascript so I've decided to write something like that :很多人告诉我在 javascript 上尝试它，所以我决定写这样的东西：
function onAlertClick() {
alert("ceci est une alerte");
}
alert("test2");
var bA = document.getElementById("boutonAlerte");
bA.addEventListener("onclick", onAlertClick());
But this is the same thing.但这是同样的事情。
Any ideas ?有任何想法吗 ？
8 个解决方案
解决方案1
2 已采纳 2016-04-25 12:23:31
Try adding jQuery click event, which are working fine with my cordova apps 尝试添加jQuery click事件，该事件在我的cordova应用中正常运行
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.3.js"></script>
<script type="text/javascript">
$("#boutonAlerte").click(function(){
alert("ceci est une alerte");
});
</script>
Here is JSFiddle link 这是JSFiddle链接
https://jsfiddle.net/9v85ku5y/ https://jsfiddle.net/9v85ku5y/
解决方案2
2 2017-05-24 15:55:15
Solution 解
// Function to change the content of t2 //更改t2内容的函数
function modifyText() {
var t2 = document.getElementById("t2");
if (t2.firstChild.nodeValue == "three") {
t2.firstChild.nodeValue = "two";
} else {
t2.firstChild.nodeValue = "three";
}
}
// add event listener to table //将事件监听器添加到表
var el = document.getElementById("outside");
el.addEventListener("click", modifyText, false);
解决方案3
1 2016-04-25 03:22:13
onclick is not fired on cordova apps, because users don't "click", instead, they "tap". 在用户的应用程序上不会触发onclick，因为用户不是“点击”，而是“点击”。 You may use a decent mobile framework like Ionic, and use ng-click , it automatically solves the problem for you, because it includes ngTouch . 您可以使用像Ionic这样的体面的移动框架，并使用ng-click ，它会自动为您解决问题，因为它包含ngTouch 。
If you prefer not to use a big framework like angular, you may use Zepto.js , and use $(".element").on('tap', callback); 如果您不想使用像angular这样的大型框架，则可以使用Zepto.js ，并使用$(".element").on('tap', callback); Zepto.js to listen for tap events. 监听点击事件。 Or $(".element").on('tap click', callback); 或$(".element").on('tap click', callback); to listen for both tap and click events. 监听点击和点击事件。
Chrome dev tools has good mobile emulation, to trigger tap events. Chrome开发人员工具具有良好的移动仿真功能，可以触发点击事件。 It may be helpful if you want to debug you app in Chrome. 如果您想在Chrome中调试应用，这可能会有所帮助。
解决方案4
1 2021-08-06 20:01:21
I hear about a click to make "click" event to work.我听说点击使“点击”事件起作用。 The trick is adding the css cursor property to "pointer" in that way, when the user tap triggers the click event.诀窍是以这种方式将 css cursor 属性添加到“指针”，当用户点击触发点击事件时。
Here is some example using this trick:这是使用此技巧的一些示例：
function clickEvent(element, callback){
element.setAttribute("style", "cursor: pointer;");
element.addEventListener("click", callback);
}
clickEvent(document.getElementById("mybutton"), function(){
alert("Clicked");
});
By using the function "clickEvent" you can get the "click" to work通过使用函数“clickEvent”，你可以让“click”工作
解决方案5
0 2016-04-25 05:16:58
Define a clickhandler that you can use later on: 定义一个供以后使用的点击处理程序：
var clickHandler = ('ontouchstart' in document.documentElement ? "touchstart" : "click");
$("a").bind(clickHandler, function(e) {
alert("clicked or tapped. This button used: " + clickHandler);
});
This will trigger click on non-touch devices and touchstart on touch devices. 这将触发非触摸设备上的点击，并触发触摸设备上的touchstart。
When that is said, I will strongly recommend using Fast click instead, and use regular click-events. 话虽如此，我强烈建议您改为使用“快速点击”，并使用常规点击事件。 With the above solution, you will trigger "touchstart" on links when you swipe on it to scroll the page for instance - which is not ideal. 使用上述解决方案，例如，当您在链接上滑动以滚动页面时，您将在链接上触发“ touchstart”-这并不理想。
解决方案6
0 2016-04-25 12:31:00
You can try to do the following: 您可以尝试执行以下操作：
$("#boutonAlerte").on('click', function(){
alert("Clicked!");
});
Then remove the onclick from your button tag and make sure that you included the jQuery library in your HTML o course. 然后从按钮标签中删除onclick ，并确保您在HTML o课程中包括了jQuery库。
If you want to use JavaScript only you should do : 如果只想使用JavaScript，则应该执行以下操作：
<button onclick="myFunction();" id="boutonAlerte">Alerte</button>
<script>
function myFunction(){
alert("clicked!");
}
</script>
解决方案7
0 2018-08-15 08:52:26
Here is a jQuery example 这是一个jQuery示例
html HTML
<a href="#" class="start-button">EXECUTE</a>
jquery jQuery的
$(".start-button").click(function (e) { //note that 'onclick="HandleExec();return false;" doesnt work
e.preventDefault();
// here you can handle the click code you wanted
});
make sure that you call event.preventDefault(); 确保您调用event.preventDefault（）; so it doesn't try to go to the href in the html tag. 因此它不会尝试转到html标签中的href。 That will just reload the cordova app in this case. 在这种情况下，这只会重新加载cordova应用程序。
解决方案8
0 2018-08-16 09:44:31
The solution is quite simple, actually. 实际上，解决方案非常简单。 All elements, that you would like to have the click event working on, should have the CSS rule "cursor: pointer;" 您希望使click事件起作用的所有元素都应具有CSS规则“ cursor：pointer;”。
You can find a working example here: https://haensel.pro/apache-cordova/apache-cordova-ios-click-event-not-working-quick-how-to 您可以在这里找到一个有效的示例： https : //haensel.pro/apache-cordova/apache-cordova-ios-click-event-not-working-quick-how-to
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.