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

时间:2012-08-07 20:56:11

标签: javascript

在开始之前,我已经阅读了与此主题相关的其他一些帖子,例如; 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;

我有几个朋友为我查看代码,似乎每个人都认为它应该有效,所以当一切都运行完美后,一旦你重新加载页面,我们就会全神贯注于可能出现的问题。 / p>

任何帮助都会很棒,我确信我刚刚做了些蠢事,但请让我知道!

亲切的问候, Mitchell Ransom

1 个答案:

答案 0 :(得分:0)

好吧已经有一段时间了,因为我问过这个问题,而我仍然没有把它搞清楚。我决定完全删除这个功能。不是一个真正的答案,但由于似乎没有解决方案,它是能够继续项目其余部分的唯一答案。