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

【问题标题】：Disable submit button until the user write number禁用提交按钮，直到用户写数字
【发布时间】：2021-04-07 02:41:57
【问题描述】：

所以我有一个简单的问题，我正在尝试构建一个兑换货币的兑换反应应用程序。我想禁用提交按钮，直到用户在所需输入中输入数字，我看到很多答案，但所有答案都使用 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>

【问题讨论】：

jQuery 是“只是 JavaScript”，你也标记了这个 ReactJS。如果您使用的是 React，那么答案将变得戏剧性地不同。
你应该learn how to use the label element properly。如果没有 for 属性或其中的表单控件，标签是无用的。你还需要正确拼写label。
stackoverflow.com/questions/30187781/…

标签： javascript html reactjs

【解决方案1】：

希望对你有帮助

我已在您的文本框代码中添加了一个事件 onkeyup 以运行该函数，

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>

【讨论】：