Question

我正在尝试制作一个HTML页面来控制家庭以外的恒温器。我想使用HTML button属性来增加/减少值，但它不起作用。我的代码出了什么问题？

如果您想使用JQuery，请轻松解释，因为我是JS的新手。

代码：

<script>
  var heatTemp=21;
</script>

<button class="temp_btn" onClick="heatTemp++">⇧</button>
<button class="temp_btn" onClick="heatTemp--">⇩</button>

<p id="heatset"></p>
<script>
  document.getElementById("heatset").innerHTML = heatTemp;
</script>

如果它是微不足道的，抱歉，但我找不到任何关于此的提示......再次抱歉。

Answer 1

您必须在每次点击时更新innerHtml。所以我将加号和减号移动到一个新函数。也不要忘记在#heatset中显示21的初始值：

<script>
  var heatTemp=21;
</script>

<button class="temp_btn" onClick="changeTemp(1)">⇧</button>
<button class="temp_btn" onClick="changeTemp(-1)">⇩</button>

<p id="heatset">21</p>
<script>
function changeTemp(dt){
   heatTemp =heatTemp + dt;
  document.getElementById("heatset").innerHTML = heatTemp;
}
</script>

js - 使用js按钮更改html属性

1 个答案: