input相关问题总结

一、onfocus
上次项目使用这个东西然后一直出现未知错，特此写下，方便自己回头复习。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div class="inpuit_contain">
			<input type="text"  class="b"/>
			<input type="text"  class="a"/>
			<input type="text"  class="a"/>
			<input type="text"  class="a"/>
			<input type="text"  class="a"/>
		</div>
	</body>
	<script type="text/javascript">
		window.onload=function(){
			var inputs=document.getElementsByClassName("inpuit_contain")[0];
			//原生js 获取元素下的东西
			var a=inputs.getElementsByTagName("input");
			for (var i = 0; i < a.length; i++) {
				a[i].onfocus=function(){
					console.log(this)
				}
			}
		}
		
	</script>
</html>

二、

1、onchange事件与onpropertychange事件的区别：
onchange事件在内容改变（两次内容有可能还是相等的）且失去焦点时触发；onpropertychange事件却是实时触发，即每增加或删除一个字符就会触发，通过js改变也会触发该事件，（通过资料查询onpropertychange时IE专属，但是通过实际操作，使用jq的bind的进行绑定可以实现效果，但是通过js变化的文字onpropertychange不触发）

	$("#input1").bind("input propertychange",function(){
	console.log(this.value)
})

2、oninput事件与onpropertychange事件的区别：
oninput事件是IE之外的大多数浏览器支持的事件，在value改变时触发，实时的，即每增加或删除一个字符就会触发，然而通过js改变value时，却不会触发；onpropertychange事件是任何属性改变都会触发的，而oninput却只在value改变时触发，oninput要通过addEventListener()来注册，onpropertychange注册方式跟一般事件一样。（此处都是指在js中动态绑定事件，以实现内容与行为分离）
oninput 是 HTML5 的标准事件，对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用，在内容修改后立即被触发，不像 onchange 事件需要失去焦点才触发。不过oninput 事件在 IE9 以下版本不支持，需要使用 IE 特有的 onpropertychange 事件替代。

3、oninput与onpropertychange失效的情况：
（1）oninput事件：a). 当脚本中改变value时，不会触发；{ 资料查询 b).从浏览器的自动下拉提示中选取时，不会触发。实际操作中下拉框的内容变化，oninput会触发 }
（2）onpropertychange事件：当input设置为disable=true后，onpropertychange不会触发。

如果我们用于模糊查询发布文章时的实时编译 oninput 已经够用了

***by the way , valueof();是返回数据的，后面虽然带括号，但是不能传值

<p id="demo">单击按钮返回数组。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	var x=document.getElementById("demo");
	x.innerHTML=fruits.valueOf();
}

**区别浏览器的方法可参考
在这里插入图片描述

IE11已经不支持！！winodw.object
https://blog.csdn.net/u011020012/article/details/51209443

onClick和onclick不一样！！！

input相关问题总结

猜你喜欢