12-表单效果

• 需求: 输入框没有内容就禁用提交按钮

<form action="http://www.it666.com">
    <input type="text" placeholder="请输入搜索关键字" name="text">
    <input type="submit" value="搜索">
</form>

• 在JS中如果HTML标签的属性名称和取值名称一样的时候, 那么JS会返回true/false

    let oText = document.querySelector("input[type=text]");
    let oSubmit = document.querySelector("input[type=submit]");
    // 在JS中如果HTML标签的属性名称和取值名称一样的时候, 那么JS会返回true/false
    oSubmit.disabled = true;
  
    oText.oninput = function () {
        oSubmit.disabled = this.value.length === 0;
    };
  

• 注意点: 如果是通过代码给 input 数组的数据, 那么不会触发 oninput 事件

    oText.value = "abc";