0 2,向select选项中 加入一个Item $("#selectid").append("1111"); 3,从select选....">

当前位置:  编程技术>jquery

Jquery操作select实例大全

    来源: 互联网  发布时间:2014-10-08

    本文导语:  第一部分,基础操作实例:   1,判断select选项中 是否存在Value="paraValue"的Item $("#selectid option[value='paraValue']").length>0 2,向select选项中 加入一个Item $("#selectid").append("1111"); 3,从select选项中 删除一个Item $("#selectid").remove("1...

第一部分,基础操作实例:
 

1,判断select选项中 是否存在Value="paraValue"的Item
$("#selectid option[value='paraValue']").length>0
2,向select选项中 加入一个Item
$("#selectid").append("1111");
3,从select选项中 删除一个Item
$("#selectid").remove("1111");
4,修改select选项中 value="paraValue"的text为"paraText"
$("#selectid option:selected").attr("value","paraValue").attr("text","paraText");
5,设置select中text="paraText"的第一个Item为选中
$("#selectid option[text='paraText']").attr("selected","true")
6,设置select中 value="paraValue"的Item为选中
$("#selectid option[value='paraValue']").attr("selected","true")
7,设置select中第一 个Item为选中
$("#selectid option").eq(0).attr('selected', 'true');
8,得到select的当前选中项的value
$("#selectid").val();
9,得到select的当前选中项的text
$("#selectid").text();
10,得到select的当前选中项的Index
document.getElementById("select1").selectedIndex;
$("#selectid").get(0).selectedIndex
11,清空select的项
$("#selectid").empty();

第二部分,JS版本的:
 

代码示例:
//1.判断select选项中 是否存在Value="paraValue"的Item 
function jsSelectIsExitItem(objSelect,objItemValue) 

     var isExit = false ; 
     for ( var i=0;i;I++) 
     { 
         if (objSelect.options[i].value == objItemValue) 
         { 
             isExit = true ; 
             break ; 
         } 
     }      
     return isExit; 

  
//2.向select选项中 加入一个Item 
function jsAddItemToSelect(objSelect,objItemText,objItemValue, objItemPos) 

     //判断是否存在 
     if (jsSelectIsExitItem(objSelect,objItemValue)) 
     { 
         alert( "该Item的 Value值已经存在" ); 
     } 
     else 
     { 
     var varItem = new Option(objItemText,objItemValue); 
//  objSelect.options[objSelect.options.length] = varItem; 
    objSelect.options.add(varItem, objItemPos); 
    alert( "成功加入" ); 
     }    

  
//3.从select选项中 删除一个Item 
function jsRemoveItemFromSelect(objSelect,objItemValue) 

     //判断是否存在 
     if (jsSelectIsExitItem(objSelect,objItemValue)) 
     { 
         for ( var i=0;i;I++) 
         { 
             if (objSelect.options[i].value == objItemValue) 
             { 
                 objSelect.options.remove(i); 
                 break ; 
             } 
         }        
         alert( "成功删除" );            
     } 
     else 
     { 
         alert( "该 select中 不存在该项" ); 
     }    

  
//4.修改select选项中 value="paraValue"的text为"paraText" 
function jsUpdateItemToSelect(objSelect,objItemText,objItemValue) 

     //判断是否存在 
     if (jsSelectIsExitItem(objSelect,objItemValue)) 
     { 
         for ( var i=0;i;I++) 
         { 
             if (objSelect.options[i].value == objItemValue) 
             { 
                 objSelect.options[i].text = objItemText; 
                 break ; 
             } 
         }        
         alert( "成功修改" );            
     } 
     else 
     { 
         alert( "该 select中 不存在该项" ); 
     }    

          
//5.设置select中text="paraText"的第一个 Item为选中 
function jsSelectItemByValue(objSelect,objItemText) 
{    
     //判断是否存在 
     var isExit = false ; 
     for ( var i=0;i;I++) 
     { 
         if (objSelect.options[i].text == objItemText) 
         { 
             objSelect.options[i].selected = true ; 
             isExit = true ; 
             break ; 
         } 
     }      
     //Show出结果 
     if (isExit) 
     { 
         alert( "成功选中" );            
     } 
     else 
     { 
         alert( "该 select中 不存在该项" ); 
     }    

  
//6.设置select中value="paraValue"的Item 为选中 
document.all.objSelect.value = objItemValue; 
  
//7.得到select的当前选中项的value 
var currSelectValue = document.all.objSelect.value; 
//8.得到select的当前选中项的text 
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text; 
//9.得到select的当前选中项的Index 
var currSelectIndex = document.all.objSelect.selectedIndex; 
  
//10.清空select的项 
document.all.objSelect.options.length = 0;
您可能感兴趣的文章:
  • jquery对select列表取值与赋值
  • jQuery select操作方法总结
  • jquery操作select实例
  • jquery select默认选中的设置方法
  • jQuery 获取与设置select下拉框的值
  • Jquery 获取与设置select下拉框(示例)
  • Jquery操作select的小例子
  • jquery遍历select元素的二种方法(实例)
  • JQuery操作Selected的实例代码
  • jquery 下拉表单(select)操作方法总结
  • jquery中select操作的例子
  • juqery 操作select的语法介绍

    
 
 

您可能感兴趣的文章:

  • jquery使用jquery.zclip插件复制对象的实例教程
  • JQuery验证特殊字符实例
  • jquery检验实例-改变错误提示信息的位置
  • textarea显示成label的样式 jquery实例
  • jQuery实现回车键(Enter)切换文本框焦点的代码实例
  • jquery修改属性值实例代码(设置属性值)
  • Jquery each方法跳出循环,并获取返回值(实例讲解)
  • jquery等宽输出文字插件的实例代码
  • jquery 回车事件的实例分享
  • jquery 获取dom固定元素 添加样式的简单实例
  • Jquery 获取元素位置序号的实例代码
  • jquery获得表单所有数据的实例分享
  • jQuery回车键事件实例代码
  • Jquery 键盘按键监听与滑动效果的实例
  • c/c++ iis7站长之家
  • jquery导航固定效果实例
  • jquery 延迟执行的实例分享
  • JQuery validate日期比较实例
  • Jquery如何获取新浪天气预报?实例代码
  • jquery 网页自动播放声音实例
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jquery下拉select控件操作方法分享(jquery操作select)
  • Cookie操作插件 jQuery.Cookie
  • jquery链式操作、链式写法的小例子
  • 利用js(jquery)操作Cookie的方法说明
  • jQuery操作select option选项(增加 删除 修改)
  • jquery常用操作小结
  • JQuery操作DOM的笔记
  • jquery链式操作的正确使用方法
  • jQuery操作select下拉框的text值和value值的方法
  • JQuery 文本框操作的4个小例子
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • 使用jquery中height()方法获取各种高度大全
  • JQuery下拉控件select操作方法大全
  • jquery 操作input标签方法大全
  • jquery选择器大全 全面详解jquery选择器
  • jquery操作select大全
  • jquery选择器大全详解
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery圆角插件 jQuery Corners
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin
  • jQuery日历插件 jQuery Week Calendar
  • jQuery的中文日历插件 jQuery.datePickerCn
  • jQuery实现CSS3动画效果的插件 jQuery Transit
  • jQuery的CSV插件 jQuery CSV
  • jQuery的气泡提示插件 jquery.ns_bub.js
  • jQuery气泡提示插件 jquery-rollover-tooltip
  • jQuery对话框 jQuery Modal Dialog
  • jQuery 插件 jQuery Ripples
  • 精简版的jQuery jQuery.ish
  • jQuery的OpenSocial插件 OpenSocial jQuery
  • jQuery链接插件 jquery.biggerlink


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3