1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 【Java Web基础】(五)实现新增下拉列表—由用户输入内容(Html+JS)

【Java Web基础】(五)实现新增下拉列表—由用户输入内容(Html+JS)

时间:2023-10-23 15:20:06

相关推荐

【Java Web基础】(五)实现新增下拉列表—由用户输入内容(Html+JS)

Html文件中的代码:

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>尝试一下</title><script type="text/javascript" src="MyJS.js" charset="UTF-8"></script> </head><body><form name="myForm" action=""><select name="cities" onchange="gg()"><option value="DaLian">大连</option><option value="BeiJing">北京</option><option value="ShangHai">上海</option><option value="GuangZhou">广州</option></select><input type="button" value="点击增加选项" onclick="add()"/></form></body></html>

MyJS.js文件中的代码:

document.write('<script src="ChinesePY.js"><\/script>'); //引入当前目录下的ChinesePY.js文件。function add(){var opObject=document.myForm.cities;opObject.length++;var x=prompt("请输入你所在的城市");var Py=Pinyin.GetQP(x);opObject.options[opObject.length-1]=new Option(x,Py);}function gg(){var opObject=document.myForm.cities;for(var i=0;i<opObject.length;i++){if(opObject.options[i].selected){alert(opObject.options[i].value);alert(opObject.options[i].text);}}}

实现效果:

1、运行界面效果

2、点击按钮后弹出输入框,输入后单击确定

3、可以在下拉列表中看到新添加的内容

4、导入了ChinesePY脚本,所以可以将用户输入内容转换为拼音,效果如下:

需要ChinesePY这个拼音转换包的话,我可以发

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。