$(function(){
讓客戶滿意是我們工作的目標,不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術(shù)通過有效、簡單的方式提供給客戶,將通過不懈努力成為客戶在信息化領(lǐng)域值得信任、有價值的長期合作伙伴,公司提供的服務項目有:主機域名、網(wǎng)頁空間、營銷軟件、網(wǎng)站建設(shè)、義縣網(wǎng)站維護、網(wǎng)站推廣。
$('div').hover(function(){
$(this).addClass('two');
},function(){
$(this).removeClass('two');
});
});
只哪個給哪個加,移除以后去掉
JQuery:
$("#submit").click(function(){
var?submit=$("#one").val();
alert(submit);
if(submit=="")
{
return?false;??//?返回false,a標簽就會終止動作,不跳轉(zhuǎn)
}else{
return?true;???//?返回true?,a標簽繼續(xù)執(zhí)行后續(xù)操作,跳轉(zhuǎn)
}
原生:
html?:?????a?href="haha.html"?onclick="testVal"?id="submit"提交/a
function?testVal(){
var?submit?=?document.getElementById("one").value;
alert(submit);
if(submit){
return?false;
}else{
return?true;
}
}
這樣就可以
style?type="text/css"
div{
width:200px;
height:200px;
background:#EEE;
}
#two{
position:absolute;
left:100px;
top:50px;
background:#F60;
}
/style
div?id="one"One/div
div?id="two"Two/div
div?id="three"Three/div
script
console.log(isOverlap("one","two"));//true
console.log(isOverlap("one","three"));//false
console.log(isOverlap("two","three"));//true
function?isOverlap(idOne,idTwo){
var?objOne=$("#"+idOne),
objTwo=$("#"+idTwo),
offsetOne?=?objOne.offset(),
offsetTwo?=?objTwo.offset(),
topOne=offsetOne.top,
topTwo=offsetTwo.top,
leftOne=offsetOne.left,
leftTwo=offsetTwo.left,
widthOne?=?objOne.width(),
widthTwo?=?objTwo.width(),
heightOne?=?objOne.height(),
heightTwo?=?objTwo.height();
var?leftTop?=?leftTwo??leftOne??leftTwo??leftOne+widthOne?
topTwo??topOne??topTwo??topOne+heightOne,
rightTop?=?leftTwo+widthTwo??leftOne??leftTwo+widthTwo??leftOne+widthOne?
topTwo??topOne??topTwo??topOne+heightOne,
leftBottom?=?leftTwo??leftOne??leftTwo??leftOne+widthOne?
topTwo+heightTwo??topOne??topTwo+heightTwo??topOne+heightOne,
rightBottom?=?leftTwo+widthTwo??leftOne??leftTwo+widthTwo??leftOne+widthOne?
topTwo+heightTwo??topOne??topTwo+heightTwo??topOne+heightOne;
return?leftTop?||?rightTop?||?leftBottom?||?rightBottom;
}
/script
//原理很簡單,就是判斷一個元素的四個點是否在另一個元素內(nèi)部。
要執(zhí)行需要引入jquery庫
首先使用jquery選擇器獲取到想要綁定click事件的img元素,然后可以直接綁定click方法,也可以通過bind方法綁定。這里詳細介紹一下bind方法。brbrjquery 事件 - bind() 方法 —— 定義和用法br bind() 方法為被選元素添加一個或多個事件處理程序,并規(guī)定事件發(fā)生時運行的函數(shù)。brbrjquery 事件 - bind() 方法 ——將事件和函數(shù)綁定到元素br 規(guī)定向被選元素添加的一個或多個事件處理程序,以及當事件發(fā)生時運行的函數(shù)。brbrjquery 事件 - bind() 方法——語法br $(selector).bind(event,data,function)brbrjquery 事件 - bind() 方法——參數(shù)描述br event 必需。規(guī)定添加到元素的一個或多個事件。由空格分隔多個事件。必須是有效的事件。br data br可選。規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)。br function br必需。規(guī)定當事件發(fā)生時運行的函數(shù)。brbr實例:br//直接給所有img標簽綁定click事件br$("img").click(function(){br alert('你點擊了圖片');br})brbr//使用bind方法綁定click事件br$("img").bind("click",function(){br alert('你點擊了圖片');br})brbr拓展:jquery給元素綁定事件的方法還有one、live、toggle、on(新增)等方法,詳細可參考jquery官方文檔。
jQuery 層次選擇器
$("div span") 選取div里的所有span元素
$("div span") 選取div元素下元素名是span的子元素
$("#one +div") 選取id為one的元素的下一個div同輩元素 等同于$(#one).next("div")
$("#one~div") 選取id為one的元素的元素后面的所有div同輩元素 等同于$(#one).nextAll("div")
$(#one).siblings("div") 獲取id為one的元素的所有div同輩元素(不管前后)
$(#one).prev("div") 獲取id為one的元素的前面緊鄰的同輩div元素
所以 獲取元素范圍大小順序依次為:
$(#one).siblings("div")$("#one~div")$("#one +div") 或是
$(#one).siblings("div")$(#one).nextAll("div")$(#one).next("div")
不積跬步,無以至千里!