代码之家 › 专栏 › 技术社区 › user3108268

单击时增加div中的数字

jquery html javascript

user3108268 · 技术社区 · 4 年前

我有这个解决方案 <form> 和 <input> 元素。

function incrementValue()
{
    var value = parseInt(document.getElementById('number').value, 10);
    value = isNaN(value) ? 0 : value;
    value++;
    document.getElementById('number').value = value;
}

<form>
   <input type="text" id="number" value="0"/>
   <input type="button" onclick="incrementValue()" value="Increment Value" />
</form>

但我如何通过点击一个 <a></a> 按钮和 <div></div> ?

2 回复 | 直到 4 年前

luek baja 4 年前

你是说像这样吗?

const a = document.getElementById("a"),
  div = document.getElementById("div");
  
a.addEventListener("click", event => {
  //this is just to prevent redirects when you click the link
  event.preventDefault();
  
  //gets the number in div
  const num = parseInt(div.innerHTML);
  
  //increments the number
  div.innerHTML = num + 1;
});

<a id="a" href="">Anchor Tag</a>
<div id="div">0</div>

buzatto 4 年前

我建议使用 button 而不是 anchor 作为一个html标记,它更有意义。你会操纵财产 innerText 为此:

function incrementValue()
{
    var value = parseInt(document.getElementById('number').innerText, 10);
    value = isNaN(value) ? 0 : value;
    value++;
    document.getElementById('number').innerText = value;
}

<div id="number"/>0</div>
<button onclick="incrementValue()" />Increment Value</button>

推荐文章

Softly · 单选按钮未按预期取值

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Thirumal isireddy · 在导航栏顺风css中,img被扭曲,而不是将元素推到旁边

1 年前

eXor420 · 如何在脚本标记中使用导出的函数?

1 年前

Hadi · 如何在无效和有效输入中选择用于更改样式的psoudo元素(after)

1 年前

IonicMan · 剑道网格在宽度过大时不显示某些列

1 年前

Kernier · 如何将数学公式支持添加到StacksEditor?

1 年前

Md. Ibrahim · CSS网格项溢出小屏幕滚动

1 年前

Arjun V Srivatsa · 如何将系统时区信息分配给javascript中的变量?

1 年前

Akshay mek · Vscode扩展建议不适用于某些文件夹

1 年前