当前位置:首页 > 开发 > Web前端 > 前端 > 正文

-JQ简单选择器

发表于: 2015-11-09   作者:互联网   来源:转载   浏览次数:
摘要:   $(“form  ~input”)             //和from同级的 元素 $("input[type=checkbox]:checked")     //所有选中的ch

 

$(“form  ~input”)             //和from同级的 元素

$("input[type=checkbox]:checked")     //所有选中的checkbox

$("#id").animate({ top: 100 }, "slow", "swing");   //选择的元素要加 position属性

 

dropdownlist操作

$("#id").change(function(){});                             //添加事件

$("#id").find("option:selected").text();            //获取Select选择的Text

$("#id").val();                                                         //获取Select选择的Value

$("#id ").get(0).selectedIndex=1;                    //设置Select索引值为1的项选中


$("#id ").val(2);                                                    //设置Select的Value值为2的项选中


$("#id option[text=aa]").attr("selected", true);   //设置Select的Text值为aa的项选中
 

 

jQuery添加/删除Select的Option项:
语法解释:
  $("#id").append("<option value='Value'>Text</option>");          //为Select追加一个Option(下拉项)
$("#id").prepend("<option value='0'>请选择</option>");            //为Select插入一个Option(第一个位置)
$("#id option:last").remove();                                                              //删除Select中索引值最大Option(最后一个)
$("#id option[index='0']").remove();                                                  //删除Select中索引值为0的Option(第一个)
$("#id option[value='3']").remove();                                                  //删除Select中Value='3'的Option
$("#id option[text='4']").remove();                                                    //删除Select中Text='4'的Option

 

radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;

 

 

-------------

<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>

表格选择

$("tr:even")           //选择表格奇数行

$("tr:odd")            //选择表格偶数行

$("tr:first")             //选择第一行

$("tr:gt(0)")           //选择>第一行,不包括第一行

$("tr:last")             //选择最后一行

-------------------

<h1>Header 1</h1>

<h2>Header 2</h2>

$(":header").css("background", "#EEE");    //给所有标题加背景

结果是--》<h1 style="background:#EEE;">Header 1</h1>

                  <h2 style="background:#EEE;">Header 2</h2>

 

 

-----------------------

<div>Resig</div>
<div>George Martin</div>

<div></div>

$("div:contains('John')")           //匹配 含有John的div

$("td:empty")                             //匹配内容为空的div

 

----------------------------

<div><p>Hello</p></div>

$("div:has(p)").addClass("test");     //匹配含有P标签的div

<div class=”test”><p>Hello</p></div>

-------------------------------

属性选择器:

<input name="milkman" />
<input name="letterman2" />

 

$("input[name*='man']")              //匹配 *man 和正则表达式的*一样

$("input[name$='man2']")           //name以man2结束的

$("input[name='milkman']")         //name等于milkman

$("input[name]")                                //含有name属性的input

$("input[name^='news']")              //name以news结尾的input

 

 

----------------------------------

筛选

 

$("p").filter(".selected")    

 

$("input[type='checkbox']").parent().is("form")   //返回布尔值

 

 

-JQ简单选择器

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
这个控件关键是它能支持在mobile中显示。iPhone和android中显示可能略有差别。 下图是在android中的
这个控件关键是它能支持在mobile中显示。iPhone和android中显示可能略有差别。 下图是在android中的
这个控件关键是它能支持在mobile中显示。iPhone和android中显示可能略有差别。 下图是在android中的
图片查看器,github地址:https://github.com/VaJoy/imgViewer 效果如下: 这款当初大概写了2小时,
首先引用JQ文件,下面是所有代码; 主页面代码: 数据库数据: 脚本文件: function addli(object)
今天看到了一个简单的折叠效果:http://www.sohtanaka.com/web-design/examples/accordion/ 不过个
1、在VS中新建jq项目:   新建web窗体时选择第二个:      将系统生成的多余文件夹删掉,仅留
先介绍一下我们要实现什么功能。有1个选择器,有左右两个轮子,做轮子选择省份,右轮子选择城市,其
4.1 简单选择器 (1) :first 选取第一个元素。 (2) :last 选取最后一个元素。 (3) :not(选择器) 选取
作者: 阮一峰 日期: <a href="http://www.ruanyifeng.com/blog/2011/07/" style="list-style-t
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号