用法跟以前live有些差別,先把live改成on
- .on( events [, selector] [, data], handler(eventObject) )
有一個主要的差別,live是只要直接把事件綁在元素上就可以,可是on要先找到不是動態產生的元素,像下面的,如果tr是動態產生
- $("#dataTable tbody tr").on("click", function(event){
- alert($(this).text());
- });
- $("#dataTable tbody").on("click", "tr", function(event){
- alert($(this).text());
- });
另外也可以帶參數進去。
- function greet(event) { alert("Hello "+event.data.name); }
- $("button").on("click", { name: "Karl" }, greet);
- $("button").on("click", { name: "Addy" }, greet);
如果想要用on在不同事件下執行不一樣的效果,比方在動態產生的DOM上,我們還希望他可以在滑入滑出時動態切換class,可以這樣寫:
- $("div.test").on({
- mouseenter: function(){
- $(this).addClass("inside");
- },
- mouseleave: function(){
- $(this).removeClass("inside");
- }
- });
如果要綁動態的元素,則這樣加
- $("div.test").on({
- mouseenter: function(){
- $(this).addClass("inside");
- },
- mouseleave: function(){
- $(this).removeClass("inside");
- }
- }, "a");
0 意見:
張貼留言