zoukankan      html  css  js  c++  java
  • JQuery(三)

    本文章引用了http://www.imooc.com上的JQuery基础课程。

    :input表单选择器

    如何获取表单全部元素?:input表单选择器可以实现,它的功能是返回全部的表单元素,不仅包括所有<input>标记的表单元素,而且还包括<textarea>、<select> 和 <button>标记的表单元素,因此,它选择的表单元素是最广的。

    如下图所示,使用:input表单选择器获取表单元素,并向这些元素增加一个CSS样式类别,修改它们在页面中显示的边框颜色。

                                                                                 在浏览器中显示的效果:

    注意 $("#frmTest :input") 中 :前面有空格.

    :text表单文本选择器

    :text表单文本选择器可以获取表单中全部单行的文本输入框元素,单行的文本输入框就像一个不换行的字条工具,使用非常广泛。

    例如,在表单中添加多个元素,使用:text选择器获取单行的文本输入框元素,并修改字的边框颜色,如下图所示:

                                                                                         在浏览器中显示的效果:

    :password表单密码选择器

    如果想要获取密码输入文本框,可以使用:password选择器,它的功能是获取表单中全部的密码输入文本框元素。

    例如,在表单中添加多个输入框元素,使用:password获取密码输入文本框元素,并修改它的边框颜色,如下图所示:

                                                                                                     在浏览器中显示的效果:

    :radio单选按钮选择器

    表单中的单选按钮常用于多项数据中仅选择其一,而使用:radio选择器可轻松获取表单中的全部单选按钮元素。

    例如,在表单中添加多种类型的表单元素,使用:radio选择器获取并隐藏这些元素中的全部单选按钮元素,如下图所示:

                                                                                 在浏览器中显示的效果:

    hide()方法的功能是隐藏指定的元素。

    :checked选中状态选择器

    有一些元素存在选中状态,如复选框、单选按钮元素,选中时“checked”属性值为“checked”,调用:checked可以获取处于选中状态的全部元素。

    例如,在表单中添加多个复选框和单选按钮,其中有一些元素处于选中状态,使用:checked获取隐藏处于选中状态的元素,如下图所示:

    :selected选中状态选择器

    :checked选择器相比,:selected选择器只能获取<select>下拉列表框中全部处于选中状态的<option>选项元素。

    例如,在一个添加多个<option>选项的下拉列表框中,使用:selected选择器修改处于选中状态的内容值,如下图所示:

                                                                                               在浏览器中显示的效果:

    注意:checked选择器与元素之间没有空格

    猜测:$("#frm input:selected").hide();这样子,:前就不用加空格;input:selected这样写,因为selected与input元素有直属关系所以不用加。$("#frm :selected").hide();这样子:前就得加空格;#frm :selected这样写,因为selected与form是间接关系所以要加。

    练习:如何获取列表框元素中被选中元素的的值,代码为: #(“select option:selected”).text();

  • 相关阅读:
    Centos8.2安装Mongodb4.4.2(社区版)
    Spirng 循环依赖报错:Requested bean is currently in creation: Is there an unresolvable circular reference?
    SpringBoot Test 多线程报错:dataSource already closed
    SpringCloud Stream整合RabbitMQ3.5.0
    SpringBoot2.2.5整合ElasticSearch7.9.2
    ElasticSearch7.9.2设置密码
    CentOS7安装Kibana7.9.2
    张家界国庆6天行
    安装tomcat时,SYSTEM进程(PID=4)占用80端口的几种情况及解决方法(window7系统)
    竞品分析的目的是什么?如何筛选竞品?竞品分析资料来源?
  • 原文地址:https://www.cnblogs.com/tangniannian/p/5055679.html
Copyright © 2011-2022 走看看