javascript中select下拉框的用法总结

本文针对开发项目中遇到的问题，总结了问题1:如何在select选项中选择值？将首先使用onchange()方法；该方法主要用于触发和选择框内容变化的时间。

实现代码：

！doctype html headlang=' en ' metacarset=' utf-8 '/head body select onchange=' test(event)'选项quiet/选项晴天/选项七里香/选项/select script type=' text/JavaScript ' function test(e){ var e=event？事件： window.eventalert(e . target . value)；}/脚本/正文/html

问题2:但是在开发中，我们通常选择的内容只是为了展示，但我们真正需要做的是与后台进行交互数据传输。这时，为了尽量减少http数据传输，我们通常会发送id作为数据传输符号。怎么做？在开发中，选项通常是动态创建，所以此时，我们只需要为您动态创建一个自定义属性。那么如何获得自定义属性呢？

！doctype html html head lang=' en ' meta charset=' UTF-8 '/headsdy select onchange=' test(event)' id=' sel '/select script type=' text/JavaScript '/一般来说，内容的json数据是以var data=[{name: '晴天'，id: '1' }，{name: '安静'，id: '2' }，{name: '七里香'，createOption('sel '，数据)；//create option函数create option (parentid，data){ var parentid=document . getelementbyid(parentid)；for(var I=0；idata.lengthI){ var opt=document . create element(' option ')；//设置option opt.innerHTML=data[i]的值。姓名；//定义自定义值opt.setattribute ('dataid '，data [I]。id );parentid . appendchild(opt)；} }//选择自定义属性函数测试的方法(e) {var e=event？事件： window.eventvar target=e.targetvar index=target.selectedIndexAlert ('my id=' target [index])。getattribute(' dataid ')；} /script/body/html结果图如下：

如果还想深入学习，可以点击jquery下拉框效果总结和JavaScript下拉框效果总结进行学习。

这是我在发展中遇到的问题，希望能对大家的学习有所启发。