JavaScript学习笔记8_onchangge-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_46079176/article/details/108589118

摘要：

有时，我们会给某个元素通过JavaScript的方式绑定一个onclick(),或者是onchangge事件。

但是怎么给该方法传递当前选中元素的值呢？

解决办法：

一、该为JQuery的方式，通过$(this)来获取;

二、为onclick()放入this参数：οnclick=“test_function(this)”;

三、如果是获取select下拉列表框选中的value值，那么：onchangge=“test_function(this.value)”;

一、通过JQuery来实现

请参考我另一篇博客：

传送门:JQuery——获取当前点击元素的内容

二、为onclick()添加this

例：

jsp内容:

<p onclick = "test_function(this)">这是第一个段落。</p>
<p>这是第二个段落。</p>
<p>这是第三个段落。</p>
</body>

相关js事件，与JQuery的不同之处，就是需要将this作为onclick事件的参数:

```html
<script>
function test_function(e){
    alert($(e).text());
}
</script>

效果如下：



三、如果是获取select选中的value值，不论是alert html还是value都是行不通的。

 例：

jsp页面，与上述不同的地方是，此处直接将this.value作为了事件的参数




<body>
<select onchange = "test_onchange(this.value)">
    <option value = "1" selected = "selected">1</option>
    <option value = "2">2</option>
    <option value = "3">3</option>
</select>
</body>

相关事件，在事件中直接获取到了传递进来的value值

<script>
function test_onchange(e){
 
     alert(e);
 
}
</script>


 效果如图，select又3改变成2，会弹出2对应的value值，在点击确定后，select会由选中3变成选中2.

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200914215727565.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ2MDc5MTc2,size_16,color_FFFFFF,t_70#pic_center)


但是用类似这种this.html获取选中的text值好像是行不通的。随意还是推荐使用JQuery来操作：

传送门： JQuery获取select选中的value、text等