dom啦18 表单效果

2020-10-28 11:08:01 浏览数 (1)

代码语言:javascript复制
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
<form action="http://www.it666.com">
    <input type="text" placeholder="请输入搜索关键字" name="text">
    <input type="submit" value="搜索"><!-- disabled="disabled"-->
</form>
<script type="text/javascript">
	/*
    需求: 输入框中没有内容就禁用提交按钮
    */
    let oText = document.querySelector("input[type=text]");
    let oSubmit = document.querySelector("input[type=submit]");
    oSubmit.disabled=true;//不可用
    oText.oninput=function()//输入的时候当输入字符的时候就可用了,不然不可用
    {
    	oSubmit.disabled=this.value.length===0;//false可用.
    }
    // 注意点: 如果是通过代码给input设置的数据, 那么不会触发oninput事件
   oText.value = "abc";
</script>
</body>
</html>

0 人点赞