Question

我是新手。所以我想要的是在时钟工作时隐藏 RESET 按钮，它应该在时钟stoped.same时显示 STOP 按钮，它必须只在时钟工作时出现。这一切都必须用简单和基本的Java Script完成。我不知道Jquery。

<script language="javascript">
        var t1;
        var t2;
        var t3;
        function fn_sample() {
            document.frm.txtS.value = parseInt(document.frm.txtS.value) + 1;
            t1 = document.frm.txtS.value;
            if(t1>60){

                document.frm.txtS.value = 0;
                fn_incMin();
            }
            window.setTimeout("fn_sample()", 1000);

        }

        function fn_incMin() {

            document.frm.txtM.value = parseInt(document.frm.txtM.value) + 1;
            t2 = document.frm.txtM.value;
            if(t2>60){

                document.frm.txtM.value = 0;
                fn_incHrs();

            }
            window.setTimeout("fn_incMin()", 60000);

        }

        function fn_incHrs() {

            document.frm.txtH.value = parseInt(document.frm.txtH.value) + 1;
            t3 = document.frm.txtH.value;
            window.setTimeout("fn_incHrs()", 3600000);

        }

        function fn_stop() {

            window.clearTimeout(t1);
            window.clearTimeout(t2);
            window.clearTimeout(t3);

        }

        function fn_reset() {

            document.frm.txtS.value = 0;
            document.frm.txtM.value = 0;
            document.frm.txtH.value = 0;

        }

    </script>
</head>
<body>
    <form name="frm">
        <input type="text" name="txtH" value="0" size="2"/>
        <input type="text" name="txtM" value="0" size="2"/>
        <input type="text" name="txtS" value="0" size="2"/>
        <br /><br />
        <input type="button" value="Start" onclick="fn_sample();" />
        <input type="button" value="Stop" onclick="fn_stop();" />
        <input type="button" value="Reset" onclick="fn_reset();" />
    </form>
</body>

Answer 1

你可以这样做

<input type="button" value="Start" onclick="fn_sample();this.form.reset.style.display='none'" />
<input type="button" value="Stop" onclick="fn_stop();this.form.reset.style.display='inline'" />
<input type="button" value="Reset" name='reset' onclick="fn_reset();" />

或者您也可以使用禁用属性

<input type="button" value="Start" onclick="fn_sample();this.form.reset.disabled=true" />
<input type="button" value="Stop" onclick="fn_stop();this.form.reset.disabled=false" />
<input type="button" value="Reset" name='reset' onclick="fn_reset();" />

Answer 2

基本上，您希望按钮上有一个onclick属性，如下所示：

＆＃13;

var stopClicked = function(){
  document.getElementById("stop").style.display = "none";
  document.getElementById("reset").style.display = "";
}
var resetClicked = function(){
  document.getElementById("stop").style.display = "";
  document.getElementById("reset").style.display = "none";
}

＆＃13;

<button onclick='stopClicked()' id='stop'>Stop</button>
<button onclick='resetClicked()' id='reset'>Reset</button>

＆＃13;

Answer 3

它不漂亮，但帮助你解决发生的事情

里面是什么：

变量st1，st2，st3是setTimeout的处理程序（在代码中STOP按钮不起作用） window.setTimeout 会返回与 clearTimeout
所有字段都有样式比例，显示或隐藏开始时的按钮
document.getElementById（'stop'）获取元素， style.display ='inline-block'; 在元素上设置可见或隐藏隐藏元素
在开始时显示一些按钮并隐藏不必要的，在停止显示其他人并隐藏不必要的。

这就是全部。在纯JS中。这是测试它的小提琴：https://jsfiddle.net/6qz30eae/

如何只在通过基本JS

3 个答案: