- 浏览: 2072481 次
- 性别:
- 来自: NYC
文章分类
- 全部博客 (628)
- Linux (53)
- RubyOnRails (294)
- HTML (8)
- 手册指南 (5)
- Mysql (14)
- PHP (3)
- Rails 汇总 (13)
- 读书 (22)
- plugin 插件介绍与应用 (12)
- Flex (2)
- Ruby技巧 (7)
- Gem包介绍 (1)
- javascript Jquery ext prototype (21)
- IT生活 (6)
- 小工具 (4)
- PHP 部署 drupal (1)
- javascript Jquery sort plugin 插件 (2)
- iphone siri ios (1)
- Ruby On Rails (106)
- 编程概念 (1)
- Unit Test (4)
- Ruby 1.9 (24)
- rake (1)
- Postgresql (6)
- ruby (5)
- respond_to? (1)
- method_missing (1)
- git (8)
- Rspec (1)
- ios (1)
- jquery (1)
- Sinatra (1)
最新评论
-
dadadada2x:
user模型里加上 protected def email ...
流行的权限管理 gem devise的定制 -
Sev7en_jun:
shrekting 写道var pattern = /^(0| ...
强悍的ip格式 正则表达式验证 -
jiasanshou:
好文章!!!
RPM包rpmbuild SPEC文件深度说明 -
寻得乐中乐:
link_to其实就是个a标签,使用css控制,添加一个参数: ...
Rails在link_to中加参数 -
aiafei0001:
完全看不懂,不知所然.能表达清楚一点?
"$ is not defined" 的问题怎么办
<select name=’sel’ id=’sel’> <option value=’1′>1</option> <option value=’2′ selected=’selected’>我被选中了</option> <option value=’3′>2</option> </select> <script> alert($("select[@name='sel'] option[@selected]").text()); $("#sel").val(’2′); alert($("select[@name='sel'] option[@selected]").text()); </script>
查询被选中的option中的内容当然也可以用 alert($("#sel option[@selected]").text());
稍微解释一下:
select[@name='sel'] option[@selected] 表示具有name 属性,并且该属性值为’sel’ 的select元素 里面的具有selected 属性的option 元素;可以看出有@开头的就表示后面跟的是属性。
得到select项的个数
jQuery.fn.size = function() { return jQuery(this).get(0).options.length; } //获得选中项的索引 jQuery.fn.getSelectedIndex = function() { return jQuery(this).get(0).selectedIndex; } //获得当前选中项的文本 jQuery.fn.getSelectedText = function() { if(this.size() == 0) { return "下拉框中无选项"; } else { var index = this.getSelectedIndex(); return jQuery(this).get(0).options[index].text; } } //获得当前选中项的值 jQuery.fn.getSelectedValue = function() { if(this.size() == 0) { return "下拉框中无选中值"; } else { return jQuery(this).val(); } } //设置select中值为value的项为选中 jQuery.fn.setSelectedValue = function(value) { jQuery(this).get(0).value = value; } //设置select中文本为text的第一项被选中 jQuery.fn.setSelectedText = function(text) { var isExist = false; var count = this.size(); for(var i=0;i<count;i++) { if(jQuery(this).get(0).options[i].text == text) { jQuery(this).get(0).options[i].selected = true; isExist = true; break; } } if(!isExist) { alert("下拉框中不存在该项"); } } //设置选中指定索引项 jQuery.fn.setSelectedIndex = function(index) { var count = this.size(); if(index >= count || index < 0) { alert("选中项索引超出范围"); } else { jQuery(this).get(0).selectedIndex = index; } } //判断select项中是否存在值为value的项 jQuery.fn.isExistItem = function(value) { var isExist = false; var count = this.size(); for(var i=0;i<count;i++) { if(jQuery(this).get(0).options[i].value == value) { isExist = true; break; } } return isExist; } //向select中添加一项,显示内容为text,值为value,如果该项值已存在,则提示 jQuery.fn.addOption = function(text,value) { if(this.isExistItem(value)) { alert("待添加项的值已存在"); } else { jQuery(this).get(0).options.add(new Option(text,value)); } } //删除select中值为value的项,如果该项不存在,则提示 jQuery.fn.removeItem = function(value) { if(this.isExistItem(value)) { var count = this.size(); for(var i=0;i<count;i++) { if(jQuery(this).get(0).options[i].value == value) { jQuery(this).get(0).remove(i); break; } } } else { alert("待删除的项不存在!"); } } //删除select中指定索引的项 jQuery.fn.removeIndex = function(index) { var count = this.size(); if(index >= count || index < 0) { alert("待删除项索引超出范围"); } else { jQuery(this).get(0).remove(index); } } //删除select中选定的项 jQuery.fn.removeSelected = function() { var index = this.getSelectedIndex(); this.removeIndex(index); } //清除select中的所有项 jQuery.fn.clearAll = function() { jQuery(this).get(0).options.length = 0; }
发表评论
-
Jquery array remove
2013-04-10 21:38 4534Array.prototype.remove = fu ... -
jquery each and find
2013-03-06 04:14 558$(document).ready(function () ... -
jquery的选择器
2011-11-20 01:31 1181update : 需要扩展选 ... -
一个ajax和rails交互的例子
2011-11-19 01:53 1903首先,这里用了一个,query信息解析的包,如下 https: ... -
用javascript 转换时间格式 解析时间数据
2011-07-27 04:22 1502用javascript把字符串格式的时间数据,转换成时间,或者 ... -
JavaScript 比较和逻辑运算符
2011-07-27 04:18 1125var Cts = "bblText&q ... -
转个简单版JS 简体转繁体
2011-07-07 01:32 3704<!DOCTYPE html PUBLIC " ... -
jquery对于checkbox一些处理
2011-06-09 10:27 1654<input type="checkbox&q ... -
搜索上级dom对象并隐藏,点击隐藏父元素
2011-05-21 02:33 2303类似页面如下: <tr> <td&g ... -
javascript的作用范围实例
2010-07-15 07:52 1075局部变量key点击的时候得到不能在dialog open的时候 ... -
"$ is not defined" 的问题怎么办
2010-07-13 13:42 5691有些时候发现 $(document).ready( funct ... -
javascript format Date 简单的时间格式化
2010-06-30 17:23 3888<script type="text/java ... -
Laszlo演示程序
2010-02-08 15:21 1367偶然的机会尝试了一些Laszlo,用4.7的平台,写了 ... -
使用Prototype得到单选框组的值
2009-11-26 16:46 2014Using Prototype Javascript to g ... -
Prototype 如何取得属性值
2009-11-26 16:35 2387前一阵子都是用jquery, ... -
【合集】优化和提高javascript的运行速度
2009-10-21 16:40 3578提高javascript运行的13和 ... -
prototype的Event.observe
2009-10-15 14:07 1911<script src="prototyp ... -
Prototype API chm手册
2009-10-15 14:05 4842chm可查询 prototype手册 jquery chm 可 ... -
jquery技巧:操作单选框,复选框,下拉列表 2
2009-10-15 13:56 7792var cc1 = $(".formc sel ... -
jquery技巧:操作单选框,复选框,下拉列表
2009-10-15 13:55 28491、复选框全选操作: html代码: <!-- &l ...
相关推荐
`jQuery select下拉框美化代码`这个压缩包的实现可能还包含了其他细节,如防止多次点击导致的闪烁,以及在鼠标移出下拉框时自动隐藏内容等功能。这种美化代码对于提升网站的用户体验和专业感具有积极意义,特别是...
本知识点聚焦于"80、jquery select下拉框美化代码",主要讨论如何使用jQuery来美化HTML中的select元素,以提升用户界面的视觉效果和用户体验。 传统的HTML select元素在不同浏览器中的样式表现不一,且通常缺乏...
综上所述,"jQuery Select下拉框美化代码.zip"提供的示例是一个典型的jQuery Select美化实践,通过HTML、CSS和JavaScript的协同工作,实现了美观且易用的下拉选择框。对于开发者来说,理解并掌握这一技术,不仅可以...
**jQuery Select下拉框美化代码**是用于提升网站交互体验的一种技术手段,它通过使用JavaScript库jQuery和特定的插件,如本例中的`ui-select.js`,来增强和美化HTML中的`<select>`元素。在传统的网页设计中,`...
"jquery select下拉框美化代码.zip" 提供了一种解决方案,通过结合jQuery库来增强和美化下拉框的外观和交互效果,使其更加吸引用户。 这个代码包可能包含以下几个部分: 1. **jQuery库**:jQuery是一个广泛使用的...
3. **多选模式**:对于支持多选的`<select multiple>`元素,jQuery Mobile会显示一个多选的列表,用户可以通过勾选来选择多个选项。 4. **弹出/下拉行为**:默认情况下,Select Menu会在点击后以弹出窗口的形式展示...
本项目“jQuery下拉框国家选择代码”是为网页开发者提供的一款实用工具,它允许用户在下拉菜单中选择全世界的国家,并且具备搜索功能和国旗图标显示,提升了用户体验。 首先,我们要了解jQuery如何实现下拉框的动态...
但是今天我们要为大家分享一款基于jQuery的Select下拉框美化插件,它完全重写了浏览器默认的Select下拉框样式,而且在下拉菜单展开时还伴随淡如淡出的动画效果,非常不错。当然我们以前也分享过一些类似的插件,可以...
在网页设计中,用户界面的交互性和易用性至关重要,jQuery城市下拉框菜单选择代码就是为提升用户体验而设计的一种常见技术。这个标题所指的知识点主要涉及如何使用jQuery库来实现一个动态的城市选择下拉菜单,使得...
在本文中,我们将深入探讨"jQuery Select下拉框分类菜单多选插件"这一主题,它是一款用于增强标准HTML选择器功能的实用工具。这款插件不仅提供了分门别类的下拉菜单,还集成了搜索功能,使得用户在处理大量选项时...
"jQuery Select下拉框美化特效"就是为了提升用户体验,将原本朴素的Select元素转化为具有视觉吸引力的组件。 该特效主要基于JavaScript库jQuery实现,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件...
《jQuery Select下拉框关键字匹配查询选择代码》 在网页开发中,用户界面的交互性是提升用户体验的关键因素之一。jQuery作为一个强大的JavaScript库,为开发者提供了丰富的API和工具,使得实现复杂的交互效果变得...
"jQuery Select下拉框关键字匹配查询选择代码"是关于利用jQuery实现一种功能,即在下拉选择框中通过输入关键字实时筛选出匹配的选项。这种功能常见于许多Web应用中,可以极大地提高用户体验,让用户能够快速找到目标...
**jQuery select下拉框单选和多选插件** 在Web开发中,下拉框(select)是常用的一种用户交互元素,它用于提供多个选项供用户选择。然而,原生的HTML select元素在样式和交互性上往往显得较为单一。为了解决这个...
《jQuery Select下拉框菜单选择插件》 在网页开发中,下拉框(Select)是一种常见的表单元素,用于用户在预设的选项中进行选择。然而,原生的HTML下拉框样式单一,功能有限,无法满足复杂的交互需求。这时,jQuery...
《jQuery Select下拉框样式美化插件详解及应用》 在网页设计中,下拉框(Select)作为常见的数据选择控件,其样式往往显得较为单一,无法满足设计师们追求美观与个性化的需求。jQuery,这个强大的JavaScript库,为...
"jQuery Select下拉框美化表单"项目通过结合jQuery和特定的美化插件,为网页设计师和开发者提供了一种高效、灵活的方案,以提升下拉框在网页表单中的视觉效果和交互体验,特别适合于招聘网站等需要精细控制选择项的...