<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<title>使用jQuery表单对象属性过滤选择器 </title>

	<meta charset="utf-8">

	<script language="javascript" type="text/javascript" src="jquery-3.3.1.min.js"></script>

	<style type="text/css">

		body {

			font-size: 12px;

			text-align: center

		}

		div {

			display: none

		}

		select {

			height: 65px

		}

		.clsIpt {

			width: 100px;

			padding: 3px

		}

		.GetFocus {

			border: solid 1px #666;

			background-color: #eee

		}

		#fxm {

			float: left;

			margin: 100px

		}

	</style>

	<script type="text/javascript">

		$(function () {

			$("#btn0").click(function () {

				window.location.reload();

			})

			$("#btn1").click(function () {

				$("#divA").css("display", "block");

				$("#form1 input:enabled").addClass("GetFocus");

			})

			$("#btn2").click(function () {

				$("#divA").css("display", "block");

				$("#form1 input:disabled").addClass("GetFocus");

			})

			$("#btn3").click(function () {

				$("#divB").css("display", "block");

				$("#form1 input:checked").addClass("GetFocus");

			})

			$("#btn4").click(function () {

				$("#divC").css("display", "block");

				$("#Span2").html("" + $("select option:selected").text());

			})

		})

	</script>

</head>

<body>

	<form id="form1" style="width:241px">

		<div id="divA">

			<input type="text" value="hello" class="clsIpt" />

			<input type="text" disabled="disabled" value="world " class="clsIpt" />

		</div>

		<div id="divB">

			<input type="checkbox" checked="checked" value="1" />

			<input type="checkbox" value="0" />

		</div>

		<div id="divC">

			<select multiple="multiple">

				<option value="0">Item 0</option>

				<option value="1" selected="selected">Item 1</option>

				<option value="2">Item 2</option>

				<option value="3" selected="selected">Item 3</option>

			</select>

			<span id="Span2"></span>

		</div>

	</form>

		<button id="btn0">重置</button>

		<button id="btn1">增加表单中所有属性为可用的元素类别<button>

				<button id="btn2">增加表单中所有属性为不可用的元素类别</button>

				<button id="btn3">增加表单中所有被选中的元素类别</button>

				<button id="btn4">显示表单中所有被选中option的元素内容 </button>

</body>

</html>

　　

Jquery | 基础 | jQuery表单对象属性过滤选择器的更多相关文章

  1. jQuery选择器之表单对象属性过滤选择器Demo

    测试代码: 08-表单对象属性过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  2. jQuery中的表单对象属性过滤选择器（四、八）：:enabled、:disabled、:checked、:selected

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  3. jQuery表单对象属性过滤选择器

    jQuery表单对象属性过滤选择器 <div id="p1" attr="p1"> <input type="text" ...

  4. 009 jquery过滤选择器-----------（表单对象属性过滤选择器 与 表单选择器）

    1.表单对象属性选择器 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  5. jQuery 基本选择器 层次选择器 过滤选择器 内容过滤选择器 可见过滤选择器 属性过滤选择器 表单对象属性过滤选择器

  6. jQuery选择器之表单对象属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  7. jquery 表单对象属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  8. jQuery选择器(表单元素过滤选择器)第八节

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. JQuery表单元素过滤选择器

    此选择器主要是对所选择的表单元素进行过滤: 选择器 描述 返回 enabled 选择所有的可用的元素 集合元素 disabled 选择所有的不可用的元素 集合元素 checked 选择所有被选中的元素 ...

随机推荐

  1. HDU 5366：The mook jong 递推

    The mook jong  Accepts: 506  Submissions: 1281  Time Limit: 2000/1000 MS (Java/Others)  Memory Limit ...

  2. 使用Swift作为Glance后端存储

    原文链接 http://thornelabs.net/2014/08/03/use-openstack-swift-as-a-backend-store-for-glance.html By defa ...

  3. 死去活来的OC NSArray 中文排序 及输出

    目的 1.NSArray 能够支持中文排序 2.NSLog 能够直接输出 NSArray 内的中文(事实上 java 直接打印数组也不能显示内容哈) 又是死去活来的搞了1个小时,分类实现.废话少说,上 ...

  4. CentOS7虚拟机桥接设置及问题

    转载请注明出处:jiq•钦's technical Blog  今天在VMWare WorkStation9中安装了CentOS7虚拟机. 虚拟机与宿主机网络连接有三种方式:桥接模式.NAT模式和Ho ...

  5. 细数AutoLayout以来UIView和UIViewController新增的相关API

    本文转载至 http://www.itjhwd.com/autolayout-uiview-uiviewcontroller-api/ 细数AutoLayout以来UIView和UIViewContr ...

  6. 6.游戏特别离不开脚本（3）-JS脚本操作java（3）（直接操作JS文件或者调用函数）

    java直接运行JS脚本文件的语句,游戏开发时,策划的配置文件什么的就可以分开管理了,游戏逻辑也是一样,比如:一个功能一个脚本或者一个系统一个脚本. import java.io.FileNotFou ...

  7. GSON的简单示例

    https://github.com/google/gson package com.example.wolf; import com.google.gson.JsonArray; import co ...

  8. HDU3667 Transportation —— 最小费用流（费用与流量平方成正比）

    题目链接:https://vjudge.net/problem/HDU-3667 Transportation Time Limit: 2000/1000 MS (Java/Others)    Me ...

  9. poj 3461 Oulipo（kmp统计子串出现次数）

    题意:统计子串出现在主串中的次数 思路:典型kmp #include<iostream> #include<stdio.h> #include<string.h> ...

  10. async-await系列翻译（一）

    本篇翻译的英文链接:https://docs.microsoft.com/en-us/dotnet/articles/standard/async-in-depth 使用.NET的基于任务的异步编程模 ...