<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. 几个简单的程序看PHP的垃圾回收机制

    每一种计算机语言都有自己的自动垃圾回收机制,让程序员不必过分关心程序内存分配,php也不例外,但是在面向对象编程(OOP)编程中,有些对象需要显式的销毁,防止程序执行内存溢出. 一.PHP 垃圾回收机 ...

  2. TestNG – Run multiple test classes (suite test)

    In this tutorial, we will show you how to run multiple TestNG test cases (classes) together, aka sui ...

  3. ES6常用语法简介import export

    ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...

  4. java zip压缩优化版 解决压缩后文件一直被占用无法删除

    最近进行zip操作,从网上找到一个处理方法,但是经过试验存在一些bug,主要是文件流的申明存在问题,导致jvm一直占用文件而不释放,特意把自己修改的发出来,已备记录 import java.io.Bu ...

  5. Comparing Random and Sequential Access in Disk and Memory

    The Pathologies of Big Data - ACM Queue https://queue.acm.org/detail.cfm?id=1563874

  6. Multitier architecture

    Multitier architecture - Wikipedia https://en.wikipedia.org/wiki/Multitier_architecture Common layer ...

  7. strncpy和strlen的可能的实现

    #include <stdio.h> #include <stdlib.h>//为避免与标准库中的函数发生混淆,我将它们命名为stringNCopy和stringLength ...

  8. 传统maven项目创建

    转自:https://blog.csdn.net/wangfengtong/article/details/77098238 需求表均同springmvc案例 此处只是使用maven 注意,以下所有需 ...

  9. sjtu oj 1201. SuperXOR

    Description Pangzi recently realized that bitwise XOR operation is just an addition without carries. ...

  10. AIM Tech Round (Div. 2) C. Graph and String

    C. Graph and String time limit per test 2 seconds memory limit per test 256 megabytes input standard ...