禁用提交按钮，直到用户写数字

Question

所以我有一个简单的问题，我正在尝试构建一个兑换货币的兑换反应应用程序。 我想禁用提交按钮，直到用户在所需输入中输入数字，我看到很多答案，但所有答案都使用 Jquery，只有 JS 有什么解决方案吗？ 我的 HTML 代码：

 <div id='mainHomeDiv'> <h1>Exchange</h1> <lable>From:</lable> <select> <option value=''>type</option> <option value='Dollar'>Dollar</option> <option value='Euro'>Euro</option> <option value='NIS'>NIS</option> </select> <input type='number' id='amountInput' placeholder='Amount'></input> <br /> <br /> <label>To:</label> <select> <option value=''>type</option> <option value='Dollar'>Dollar</option> <option value='Euro'>Euro</option> <option value='NIS'>NIS</option> </select> <br /> <br /> <button disabled="disabled">START</button> <br /> <br /> <button>Update</button> <button>Share on facebook</button> <button>View your exchange list</button> </div>

Answer 1

希望这对你有帮助

我在您的文本框代码中添加了一个事件onkeyup来运行 function，

 var enbbtn = document.getElementById("tgbtn"); var txtchng = document.getElementById("amountInput"); function enabledbtn() { if (txtchng.value.length > 0) { enbbtn.disabled = false; } else { enbbtn.disabled = true; } }

 <div id='mainHomeDiv'> <h1>Exchange</h1> <lable>From:</lable> <select> <option value=''>type</option> <option value='Dollar'>Dollar</option> <option value='Euro'>Euro</option> <option value='NIS'>NIS</option> </select> <input type='number' id='amountInput' placeholder='Amount' onkeyup="enabledbtn()"></input> <br /> <br /> <label>To:</label> <select> <option value=''>type</option> <option value='Dollar'>Dollar</option> <option value='Euro'>Euro</option> <option value='NIS'>NIS</option> </select> <br /> <br /> <button id="tgbtn" disabled="true">START</button> <br /> <br /> <button>Update</button> <button>Share on facebook</button> <button>View your exchange list</button> </div>