新方法
2021年起,可以使用 input
偵聽所有值更改的所有事件。
舊方法
https://stackoverflow.com/a/17759257/6784662
[……]
CSS選擇器中沒有所謂的「萬用字元(*)」,可以透過一些方式接近模糊查詢方式,查找匹配屬性或值的元素
下表屬性名稱不一定為Class,可以替換成需要的屬性
單引號可有可無
[class]比對元素包含指定屬性[id][class][href] 比對元素包含其中一個屬性[class=’test’] 完全比對元素屬性與值 (區分大小寫)[class^=’test’]比對元素屬性開頭為指定的值[class$=’test’] 比對元素屬性結尾為指定的值 [class*=’test’] 模糊比對屬性包含指定的值
See the Pen
CSS 選擇器,模糊查找匹配元素 by VECTOR.cool (@ann71727)
on CodePen.
[……]
jQuery 一般情況下,利用 clone() 來複製元素,但是複製元素後,並沒有複製原本元素綁定的事件及數據,這點有點困擾,之前是在Clone之後,重新綁定事件,但這樣會變得很麻煩,也會讓程式碼變得很亂,在 jQuery 1.4 以後 clone() 加了一個貼心的功能,可以在複製的時候選擇要不要連事件及數據一起複製。
Demo 程式如下:
這是一個簡單的範例,在按鈕上綁定一個click事件,點擊按鈕開啟警告窗
這示例程式,當我們點擊 “Clone” 這按鈕,會複製一個上方的 “Click Me”按鈕,當我們點下新產生的 “Click Me”按鈕並沒有任何反應,代表並沒有複製到原本元素綁定的事件及數據。
See the Pen jQuery clone element by VECTOR.cool
(@ann71727) on CodePen.
接著我們看下方程式碼,用相同動作,原本的 “Click Me” 按鈕及新複製出的 “Click Me” 按鈕,都可以正常運行綁定事件,換而言之,事件成功被複製,如此就不用重新綁定,非常省事呢!
See the Pen jQuery clone element and events by VECTOR.cool
(@ann71727) on CodePen.
這兩段程式碼其中只差異在這一行
在 clone 中帶入 true,即代表複製綁定事件及數據,預設情況下是 false,詳細可參考 jQuery 的技術文件
[……]
javascript 卷軸自動捲到某一元素
$('html, body').animate({ scrollTop: ele.offset().top - 110 + 'px' }, 1500 ,'easeInOutQuint');
[……]
$.param({ year: 2009, country: "Canada"}) )
$(this).attr('coords').split(',');
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.toString();
Banana,Orange,Apple,Mango
[……]
jQuery 選擇器中沒有所謂的「萬用字元(*)」,可以透過依些方式接近模糊查找元素或值的目的
下表屬性名稱不一定為Class,可以替換成需要的屬性
單引號可有可無
[class]比對元素包含指定屬性[id][class][href] 比對元素包含其中一個屬性[class=’test’] 完全比對元素屬性與值 (區分大小寫)[class^=’test’]比對元素屬性開頭為指定的值[class$=’test’] 比對元素屬性結尾為指定的值 [class*=’test’] 模糊比對屬性包含指定的值[class!=’test’]元素屬性不包含指定的值
[……]