Javascript启用/禁用按钮不起作用答案

【问题标题】：Javascript Enable / Disable Button Not WorkingJavascript启用/禁用按钮不起作用
【发布时间】：2012-08-07 20:56:11
【问题描述】：

在我们开始之前，我在这里阅读了很多与该主题相关的其他帖子，例如； How do I disable and re-enable a button in with javascript? 虽然这些帖子似乎都没有解决我的问题。

我正在使用 html、css 和 javascript 在 Dreamweaver cs6 中创建一个移动应用程序。该应用程序很简单，包括一个控制运行计时器的开始和停止按钮（即使手机关闭，此计时器也会计数，因为它会根据存储在数据库中的日期时间值计算时间差。）

我想要的是，当计时器正在运行以禁用启动按钮并启用停止按钮时，以及当计时器未运行以使其反转时。我尝试了几种不同程度的方法。

function runningTimer()
{
var timerStarted = localStorage.getItem("timerStarted");    
if (timerStarted == "true")
{   
    document.getElementById("runningTime").style.color="#00CC00";
    document.getElementById("stopButton").removeAttribute('disabled');
    document.getElementById("startButton").setAttribute("disabled", "disabled");

db.transaction(function(tx) {
    tx.executeSql("SELECT * FROM temp WHERE tempID=?", [1], function(tx, result) {
        for (var i = 0; i < result.rows.length; ++i) {
            var row = result.rows.item(i);
            var sqlStartTime = row['startTime'];
            }
        if (!result.rows.length)
        {
            alert("Error Code 420: Start Time not found.");
        }
    var currentTime = new Date();
    var jsStartTime = convertSQLtoJS(sqlStartTime);
    var shiftTimeMS = currentTime - jsStartTime;
    var shiftTime = new Date(null, null, null, null, null, null, shiftTimeMS);
    var shiftHours = shiftTime.getHours();
    if (shiftHours < 10)
        {
            shiftHours = "0" + shiftHours;
        }
    var shiftMinutes = shiftTime.getMinutes();
    if (shiftMinutes < 10)
        {
            shiftMinutes = "0" + shiftMinutes;
        }
    var shiftSeconds = shiftTime.getSeconds();
    if (shiftSeconds < 10)
        {
            shiftSeconds = "0" + shiftSeconds;
        }
        document.getElementById("runningTime").innerHTML = (shiftHours + ":" + shiftMinutes + ":" + shiftSeconds);
      });
});
}
else if (timerStarted == "false")
{
    document.getElementById("runningTime").style.color="#FF0000";
    document.getElementById("stopButton").setAttribute("disabled", "disabled");
    document.getElementById("startButton").removeAttribute('disabled'); 
}
else
{
    document.getElementById("stopButton").setAttribute("disabled", "disabled");
    document.getElementById("startButton").removeAttribute('disabled');
}

}

上面的代码在你第一次使用时不起作用。停止或开始按钮在开始时被正确禁用（取决于天气或当页面/应用程序加载时计时器是否已经运行。）但是一旦你点击停止或开始它不会重新启用按钮，直到你刷新浏览器中的页面或关闭并重新打开智能手机上的应用程序。因此，我在开始和停止按钮上添加了一个 onClick 页面加载，它在 Google Chrome 中完美运行，但在智能手机上却无法运行。

我也尝试了以下也无法正常工作的方法；

document.getElementById("stopButton").disabled=true;
document.getElementById("startButton").disabled=false;

我有几个朋友帮我检查了代码，每个人似乎都认为它应该可以工作，所以我们都在摸索可能是什么问题，因为一旦你重新加载页面，一旦一切正常。

任何帮助都会很棒，我确信我刚刚做了一些愚蠢的事情，但请告诉我！

亲切的问候，米切尔赎金

【问题讨论】：

所以基本上你是说上面的代码工作正常，但是你的代码“所以，我添加了一个 onClick 页面加载到开始和停止按钮，这在谷歌浏览器中完美运行但是它确实不能在智能手机上工作。”，不工作？那我们能看到那个代码吗？
我只是在控制用户单击按钮时发生的情况的函数中添加了 document.location.reload(true)（将时间保存到数据库并停止计时器）
没有我尝试过的代码完全可以在智能手机上运行。我添加的用于在单击时刷新页面的代码仅在浏览器中有效，因此我已将其删除，因为它会使智能手机上的应用程序崩溃。点是，.disabled=false/true;应该可以工作并且 .removeAttribute('disabled') 也应该可以工作。在我的解决方案中，这些都不是 100% 的。另外我忘了提到上面的 runningTimer() 函数每 200 毫秒重复执行一次。
你在客户端有SQL命令？！真的？？？

标签： javascript

【解决方案1】：

好吧，自从我问这个问题已经有一段时间了，我仍然没有接近弄清楚。我决定完全删除该功能。不是真正的答案，但由于似乎没有解决方案，因此它是能够继续进行项目其余部分的唯一答案。

【讨论】：