Android的web视图按键不灵 [英] Android Webview buttons not working

问题描述

我想提出一个HTML应用程序，并在网页视图运行它在Android上。一切都完美的作品如预期在我的三星S3 mini和一对夫妇，我测试了它在其它设备上，然而按钮presses对其他一些设备没有影响（例如HTC野火...我是在这个过程中中找出哪些设备不工作）。

I am making a html app, and running it on Android in a webview. Everything works perfectly as expected on my samsung s3 mini and a couple of other devices that I have tested it on, however the button presses have no effect on some other devices (for example htc wildfire... I am in the process of finding out which devices don't work).

对于按钮的CSS是：

button {
    -moz-box-shadow:inset 0px 1px 10px 0px #000000;
    -webkit-box-shadow:inset 0px 1px 10px 0px #000000;
    box-shadow:inset 0px 1px 10px 0px #000000;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #00ff00), color-stop(1, #00ff00) );
    background:-moz-linear-gradient( center top, #00ff00 5%, #00ff00 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00', endColorstr='#00ff00');
    background-color:#00ff00;
    -webkit-border-top-left-radius:42px;
    -moz-border-radius-topleft:42px;
    border-top-left-radius:42px;
    -webkit-border-top-right-radius:42px;
    -moz-border-radius-topright:42px;
    border-top-right-radius:42px;
    -webkit-border-bottom-right-radius:42px;
    -moz-border-radius-bottomright:42px;
    border-bottom-right-radius:42px;
    -webkit-border-bottom-left-radius:42px;
    -moz-border-radius-bottomleft:42px;
    border-bottom-left-radius:42px;
    text-indent:0px;
    border:1px solid #006400;
    display:inline-block;
    color:#000000;
    font-family:Arial;
    font-size:1.2em;
    font-weight:bold;
    font-style:normal;
    line-height:46px;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #00ff00;
    width:7em;
}

button:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #00ff00), color-stop(1, #00ff00) );
    background:-moz-linear-gradient( center top, #00ff00 5%, #00ff00 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00',         endColorstr='#00ff00');
    background-color:#00ff00;
}

button:active {
    position:relative;
    top:1px;
}

和按钮中的一个有：

.button-wrap {
    width:auto;
}

有趣的按钮类=键换行是唯一的按钮，一台设备上的工作。

interestingly the button with class="button-wrap" was the only button that worked on one device.

对于按钮的HTML是简单的：

The HTML for the buttons is simple:

<button class="button-list-spacing" id="play-game-button">Play!</button>

和他们背后的JS是：

$("#play-game-button").click(function (e) {
    window.location.replace("gamepage.html?soundon=" + SOUND_ON);
});

有谁知道这可能会导致一个按钮，不要点击任何回应的事情吗？我将在以后进行编辑用的设备的列表，它的工作原理上，并且它不列表。

Does anyone know any thing that could cause a button to not respond to clicking? I will edit in the future with a list of devices that it works on, and a list that it doesn't.

编辑：

按钮不起作用上
*三星Galaxy Tab 7.0 GT-P6200，Android版本3.2

The buttons do not work on * Samsung galaxy tab 7.0 GT-P6200, Android version 3.2

这里是一个小提琴： http://jsfiddle.net/Yuy7F/

我在这里发布一个相关的问题，可能是值得一试：
<一href=\"http://stackoverflow.com/questions/22595810/android-webview-messes-up-in-4-1-1-but-not-4-1-2\">Android在网页视图4.1.1弄乱但不是4.1.2

I have posted a related question here that might be worth checking out: Android WebView messes up in 4.1.1 but not 4.1.2

推荐答案

显然，你正在使用像jQuery框架。

Apparently you are using a framework like jquery.

请确保该框架的所有JavaScript文件都可用，或尝试这个办法：

Make sure all javascript files of the framework are available, or try this:

<button class="button-list-spacing" id="play-game-button" onclick="window.location.replace("gamepage.html?soundon=" + SOUND_ON);">Play!</button>

和使surevthe SOUND_ON变量是可用的。

And make surevthe SOUND_ON variable is available.

这篇关于Android的web视图按键不灵的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！