IT民工窝棚qbq.blog.chinaunix.net
qbq
全部博文(708)
国产(1)
欧美(1)
SEO(1)
CSS3(5)
TestNG(4)
HTML5(2)
iBatis(3)
URLRewrite(1)
WebService(1)
WebServer(12)
PHP(8)
OGNL(1)
AS2(2)
Multimedia(0)
Flex AS3(29)
面试(9)
Commet(1)
Ivy(2)
Bat(8)
Maven(18)
CSS(7)
Ext(9)
Spring问题集(4)
Word(1)
JFreeChart(2)
Groovy on Grails(14)
Python(1)
Portlet(3)
amCharts(4)
CSharp.NET(3)
Tools(1)
S2Dao(8)
HSQL(9)
taglib(28)
Source Safe(3)
JSTL(6)
EL(2)
Seasar-SAStruts(3)
Prototype(0)
JQuery(3)
DWR(7)
AJAX(14)
Guice(13)
Digit(2)
Notebook(4)
Log4J(8)
Servlet(2)
JSP(4)
Eclipse(12)
VB.NET(3)
DotNet(3)
JavaScript(63)
Thinking In Soft(10)
Framework(11)
English(0)
Struts2(14)
Struts(38)
Hibernate(10)
Spring(30)
HTML(14)
Web(5)
MYSQL(9)
SQLSERVER(1)
ORACLE(2)
SQL(3)
数据库(0)
DATABASE(0)
Windows(8)
JAVA(67)
Software(1)
Hardware(3)
OpenSource(2)
Microsoft(0)
Excel(4)
DIY(5)
Linux(4)
分类: Java
2009-12-10 15:15:36
document.getElementById("louyuming").options[0].selected=true;function jsSelectIsExitItem(objSelect, objItemValue) { var isExit = false; for (var i = 0; i < objSelect.options.length; i++) { if (objSelect.options[i].value == objItemValue) { isExit = true; break; } } return isExit; } Javascript 操作select是表单中常见的一种,今天删除多个select值的时候出现了问题,搞了半天原来是索引引起的(即删除的时候要从索引大的开始删,然后再删除索引小的,否则删除了索引小的后索引大的索引就变化了,再删除时就会出现问题--问题的关键是for循环是要从大到小,而不是常规的从0到length)// 4.删除select中选中的项 function jsRemoveSelectedItemFromSelect(objSelect) { var length = objSelect.options.length - 1; for(var i = length; i >= 0; i--){ if(objSelect[i].selected == true){ objSelect.options[i] = null; } } } 1判断select选项中 是否存在Value="paraValue"的Item 2向select选项中 加入一个Item 3从select选项中 删除一个Item 4删除select中选中的项 5修改select选项中 value="paraValue"的text为"paraText" 6设置select中text="paraText"的第一个Item为选中 7设置select中value="paraValue"的Item为选中 8得到select的当前选中项的value 9得到select的当前选中项的text 10得到select的当前选中项的Index 11清空select的项======================================================================动态删除select中的所有options: function deleteAllOptions(sel){ sel.options.length=0; } 动态删除select中的某一项option: function deleteOption(sel,indx){ sel.options.remove(indx); } 动态添加select中的项option: function addOption(sel,text,value){ sel.options.add(new Option(text,value)); } 上面在IE和FireFox都能测试成功,希望以后可以用上。js 代码// 1.判断select选项中 是否存在Value="paraValue"的Item function jsSelectIsExitItem(objSelect, objItemValue) { var isExit = false; for (var i = 0; i < objSelect.options.length; i++) { if (objSelect.options[i].value == objItemValue) { isExit = true; break; } } return isExit; } // 2.向select选项中 加入一个Item function jsAddItemToSelect(objSelect, objItemText, objItemValue) { //判断是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { alert("该Item的Value值已经存在"); } else { var varItem = new Option(objItemText, objItemValue); objSelect.options.add(varItem); alert("成功加入"); } } // 3.从select选项中 删除一个Item function jsRemoveItemFromSelect(objSelect, objItemValue) { //判断是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { for (var i = 0; i < objSelect.options.length; i++) { if (objSelect.options[i].value == objItemValue) { objSelect.options.remove(i); break; } } alert("成功删除"); } else { alert("该select中 不存在该项"); } } // 4.删除select中选中的项 function jsRemoveSelectedItemFromSelect(objSelect) { var length = objSelect.options.length - 1; for(var i = length; i >= 0; i--){ if(objSelect[i].selected == true){ objSelect.options[i] = null; } } } // 5.修改select选项中 value="paraValue"的text为"paraText" function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) { //判断是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { for (var i = 0; i < objSelect.options.length; i++) { if (objSelect.options[i].value == objItemValue) { objSelect.options[i].text = objItemText; break; } } alert("成功修改"); } else { alert("该select中 不存在该项"); } } // 6.设置select中text="paraText"的第一个Item为选中 function jsSelectItemByValue(objSelect, objItemText) { //判断是否存在 var isExit = false; for (var i = 0; i < objSelect.options.length; i++) { if (objSelect.options[i].text == objItemText) { objSelect.options[i].selected = true; isExit = true; break; } } //Show出结果 if (isExit) { alert("成功选中"); } else { alert("该select中 不存在该项"); } } // 7.设置select中value="paraValue"的Item为选中 objSelect.value = objItemValue; // 8.得到select的当前选中项的value var currSelectValue = objSelect.value; // 9.得到select的当前选中项的text var currSelectText = objSelect.options[document.all.objSelect.selectedIndex].text; // 10.得到select的当前选中项的Index var currSelectIndex = objSelect.selectedIndex; // 11.清空select的项 objSelect.options.length = 0; 整个实例的完整代码如下:<!doctype html public "-//w3c//dtd html 4.0 transitional//en"><html><head><title>javascript select options text value</title><meta name="keywords" content="javascript select options text value add modify delete set"><meta name="description" content="javascript select options text value add modify delete set"><script language="javascript"></script></head><body><form name="watch" method="post" action=""><select id="MySelect" name="keywords" size="10" onchange="watch_sel(this.form)"></select><br><script language="javascript"></script><input type="text" name="word" /><br /><input type="button" value="增加" onclick="watch_add(this.form);" /><input type="button" value="修改" onclick="watch_mod(this.form);" /><input type="button" value="删除" onclick="watch_del(this.form);" /><input type="button" value="保存" onclick="watch_set(this.form);" /></form></body></html>
上一篇:自己封装的AJAX
下一篇:通过javascript实现的轻量级模态框解决方案(支持Ajax)
登录 注册