jquery

来源：互联网发布：kingkong1024编程教程编辑：程序博客网时间：2024/05/29 09:14

jQuery 事件

下面是 jQuery 中事件方法的一些例子：

Event 函数绑定函数至$(document).ready(function)将函数绑定到文档的就绪事件（当文档完成加载时）$(selector).click(function)触发或将函数绑定到被选元素的点击事件$(selector).dblclick(function)触发或将函数绑定到被选元素的双击事件$(selector).focus(function)触发或将函数绑定到被选元素的获得焦点事件$(selector).mouseover(function)触发或将函数绑定到被选元素的鼠标悬停事件

$(document).ready(function(){
$(".intro").css("background-color","#B2E0FF");
});
</script>
</head>
<body>
<html>
<body>
<h1>Welcome to My Homepage</h1>
<p class="intro">My name is Donald</p>
first选择器

定义和用法

:first 选择器选取第一个元素

$("p:last").css("background-color","#B2E0FF");

实例

选择所有标题元素（h1 - h6）：

$(":header")

定义和用法

:header 选择器选取所有标题元素（h1 - h6）。

$("ul li").remove("li[title!=菠萝]");

$(this).clone().appendTo("ul"); $(this).clone(true).appendTo("ul"); // 注意参数true

$("p").replaceWith("<strong>你最不喜欢的水果是?</strong>");

//获取<p>元素的HTML代码
$("input:eq(0)").click(function(){
alert( $("p").html() );
});
//获取<p>元素的文本
$("input:eq(1)").click(function(){
alert( $("p").text() );
});

$(function(){
$("#address").focus(function(){ // 地址框获得鼠标焦点
var txt_value = $(this).val(); // 得到当前文本框的值
if(txt_value=="请输入邮箱地址"){
$(this).val(""); // 如果符合条件，则清空文本框内容
}
});
$("#address").blur(function(){ // 地址框失去鼠标焦点
var txt_value = $(this).val(); // 得到当前文本框的值
if(txt_value==""){
$(this).val("请输入邮箱地址");// 如果符合条件，则设置内容
}
})

//全选
$("#CheckedAll").click(function(){
$('[name=items]:checkbox').attr('checked', true);
});
//全不选
$("#CheckedNo").click(function(){
$('[name=items]:checkbox').attr('checked', false);
// $('[type=checkbox]:checkbox').attr('checked', false);
});
//反选
$("#CheckedRev").click(function(){
$('[name=items]:checkbox').each(function(){
//此处用JQ写法颇显啰嗦。体现不出JQ飘逸的感觉。
//$(this).attr("checked", !$(this).attr("checked"));
//$(this).prop("checked", !$(this).prop("checked"));

//直接使用JS原生代码，简单实用
this.checked=!this.checked;

$("#send").click(function(){
var str="你选中的是：\r\n";
$('[name=items]:checkbox:checked').each(function(){
str+=$(this).val()+"\r\n";
})