每当文本字段动态为空时禁用按钮

Question

这是我的代码:

<input type="text" onkeyup="if(this.value.length > 0) document.getElementById('start_button').disabled = false; else document.getElementById('start_button').disabled = true;"/>
<input type="button" value="Click to begin!" id="start_button" disabled/>

这有效但效率仍然不高,因为用户可以删除文本框内的文本,并在按住DELETE键时单击按钮.有没有更有效的方法来实现这个使用JavaScript？

Answer 1

单击按钮时添加检查以查看是否有任何文本.如果没有,则弹出警告框(或其他形式的反馈)以告知用户输入数据,而不执行按钮功能.

例:

<input id="myText" type="text" onkeyup="stoppedTyping()">
<input type="button" value="Click to begin!" id="start_button" onclick="verify()" disabled/> 

<script type="text/javascript">
    function stoppedTyping(){
        if(this.value.length > 0) { 
            document.getElementById('start_button').disabled = false; 
        } else { 
            document.getElementById('start_button').disabled = true;
        }
    }
    function verify(){
        if myText is empty{
            alert "Put some text in there!"
            return
        }
        else{
            do button functionality
        }
    }
</script>

Answer 2

最简单的方法：

简单的HTML和JavaScript：运行代码段（仅7行）

function success() {
	 if(document.getElementById("textsend").value==="") { 
            document.getElementById('button').disabled = true; 
        } else { 
            document.getElementById('button').disabled = false;
        }
    }

<textarea class="input" id="textsend" onkeyup="success()" name="demo" placeholder="Enter your Message..."></textarea>
<button type="submit" id="button" disabled>Send</button>

我使用过textarea，但是您可以使用任何html输入标签并尝试一下！编码愉快！