获取下拉框 window event this eval

最新推荐文章于 2022-01-27 13:16:32 发布

Wooo0Ooo

最新推荐文章于 2022-01-27 13:16:32 发布

阅读量148

点赞数

分类专栏： html css javascript

本文链接：https://blog.csdn.net/Wooo0Ooo/article/details/119768746

版权

html css javascript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

通过js如何获取下拉框内容

        首先先给select标签加上id属性获取select标签通过select标签对象访问value属性即对象                        名.value 不用找option标签

         原理：因为下拉框最多只能展示一个所以获取select元素节点对象操作value属性时其实也可以看作是操作option的value属性

       option如果没有声明value属性默认value的值就是文本值
       如果声明了value属性那么value属性的值为其本身

	<body>
		<select id="s1">
			<option value="0">-请选择-</option>
			<option value="1">辽宁</option>
			<option value="2">内蒙古</option>
			<option value="3">吉林</option>
		</select>
	</body>
	<script type="text/javascript">
		//获取select标签
		var s1 = document.getElementById("s1");
		//标签内容发生变化的时候触发事件
		//函数绑定事件
		s1.onchange = function(){
			console.log(s1.value);//此时select的值就是option的值
		}
		
		
	</script>

this 当前节点对象

在属性值中，如果外侧是双引号，传递参数时使用单引号
如果外侧是单引号，传递参数时使用双引号

		<input type="button" onclick="run(this.value)" value="百度度" />
		<input type="button" onclick="run(this.value)" value="腾讯讯" />
		<input type="button" onclick="run(this.value)" value="新浪浪" />
		
	</body>
	<script>
		function run(str){
			alert(str);//此时弹窗为input的值
		}
	</script>

<textarea rows="10" cols="30" onmouseout="run2(this)"></textarea>


		function run2(obj){
			obj.innerHTML+= "  &hearts;  ";
			obj.style.color = "red";
		}//效果为鼠标一移出文本区域或出现红色的心

什么是window对象

window对象指代的是档案浏览器窗体对象他是js的内置对象不用var或者let定义
我们可以在window对象上添加任何事件

		//通过window对象演示onkeydown键盘按下事件
		window.onkeydown= function(){//此时window对象直接用onkeydown事件编写函数
			//阿斯克码值 event.keyCode
			alert("啊啊啊");
		}//效果为一按键盘就会弹窗

什么是event对象

           event指代的是当前事件的对象是js的内置对象他是js的内置对象不用var或者let定义
           event对象中包含触发事件过程中的一些数据参数，比如鼠标的坐标，键盘的按键
           可以通过clientX获取鼠标的横坐标，通过clientY获取鼠标的横坐标，通过keyCode获得键盘的键码值

		//通过window对象演示onkeydown键盘按下事件
		window.onkeydown= function(){
			//阿斯克码值 event.keyCode
			alert("你按着我了，按下的键码值是 "+event.keyCode)//此时表示按下键的阿斯克码
		}
		window.onmousemove = function(){
			//打印鼠标的横纵坐标
			console.log(event.clientX+","+event.clientY);//此时会获取鼠标实时坐标
		}

eval自动识别内容

	<body>
		<input type="text" id="d1"/>
		<select id="d">
			<option value="+">+</option>
			<option value="-">-</option>
			<option value="*">*</option>
			<option value="/">/</option>
		</select>
		<input type="text" id="d2" />
		<input type="button" onclick="f1()" value="=" />
		<span id = "s1"></span>
	</body>
	<script type="text/javascript">
		function f1(){
			var d1 = document.getElementById("d1");
			var d = document.getElementById("d");
			var d2 = document.getElementById("d2");
			var s1 = document.getElementById("s1");
			//eval自动识别内容
			s1.innerHTML = eval(d1.value+d.value+d2.value);
		}//此时eval函数自动识别为两个数据之间的运算关系
	</script>

Wooo0Ooo

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
获取下拉框 window event this eval

通过js如何获取下拉框内容首先先给select标签加上id属性获取select标签通过select标签对象访问value属性即对象名.value 不用找option标签原理：因为下拉框最多只能展示一个所以获取select元素节点对象操作value属性时其实也可以看作是操作option的value属性 option如果没有声明value属性默...
复制链接

扫一扫