javascript - 当必填字段为空时按钮被禁用

Question

我正在使用this表格模板。对于文本输入，它提供了验证输入的机会(简单:如果为空，则为红色框，如果不是，则为绿色框​​)。但是，我希望仅当所有必需字段至少不为空时，我的提交按钮(下面的标记)才可单击。

<button type="submit" name="finish" class="waves-effect waves-light btn">

问候

Answer 1

使用 oninput 立即反射(reflect)输入中的更改并检查是否有任何输入为空。

HTML

    <form id="frm">
      <input type="text" name="input1" oninput="testFinish();" />
      <input type="text" name="input2" oninput="testFinish();" />
      <button type="submit" name="finish" disabled onsubmit="alert('SUBMITTED')">Finish</button>
    </form>

JavaScript

function testFinish(){
var frm = document.getElementById('frm');
if (frm['input1'].value && frm['input2'].value)
  frm['finish'].disabled = false;
}

JsFiddle