javascript - Android Webview 按钮不工作

Question

我正在制作一个 html 应用程序，并在 Android 上的 webview 中运行它。在我的 samsung s3 mini 和我测试过的其他一些设备上，一切都按预期完美运行，但是按钮按下对其他一些设备没有影响(例如 htc wildfire ...我正在寻找答案哪些设备不工作)。

按钮的 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;
}

有趣的是，带有 class="button-wrap" 的按钮是唯一可以在一台设备上使用的按钮。

按钮的 HTML 很简单:

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

有谁知道任何可能导致按钮不响应点击的事情？以后我会编辑一份它适用的设备列表，以及一份它不适用的设备列表。

编辑:

按钮不起作用* 三星 galaxy tab 7.0 GT-P6200，Android 版本 3.2

这是一个 fiddle :http://jsfiddle.net/Yuy7F/

我在这里发布了一个可能值得一试的相关问题: https://stackoverflow.com/questions/22595810/android-webview-messes-up-in-4-1-1-but-not-4-1-2

Answer 1

显然您正在使用像 jquery 这样的框架。

确保框架的所有 javascript 文件都可用，或者试试这个:

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

并确保 SOUND_ON 变量可用。