使用.on添加內容的jQuery事件？

我已將追加的內容（使用ajax）添加到我的文檔中，並且我的活動未觸發。我知道這可以通過使用.live（）來完成，但是我現在在某處讀到它已經被棄用了嗎？使用.on添加內容的jQuery事件？

這是我的代碼（它適用於文件準備罰款，但沒有對新追加項目）：

$('li[id^="inv-"] a.close').on('click', function(){ 
var item=($(this).closest("li[id^='inv-']")).attr('id'); 
var id = parseInt(item.replace("inv-", "")); 
$.ajax({ 
    type: "POST", 
    url: "ajax-invi.php", 
    dataType: "html", 
    data: "id="+idboda+"&idinv="+id+"&borrar=ok", 
    success: function(data) { 
    noty({"text":"El invitado ha sido borrado"}); 
    $("body").find('li#inv-' + id).remove(); 
    } 
    }); 
});

而且項目：

<ul> 
    <li id="inv-39"> 
    <div class="row_field"> 
    <label>Adri</label> 
    <a class="close" href="#invlist">Borrar</a> 
    </div>     
    </li> 
    <li id="inv-40"> 
    <div class="row_field"> 
    <label>Marga</label> 
    <a class="close" href="#invlist">Borrar</a> 
    </div> 
    </li> 
</ul>

來源

2012-03-26 Elaine Marley

'e.preventDefault（）;'是招http://stackoverflow.com/a/9869024/880434 – 2012-03-26 08:56:44

嘗試

$('ul').on('click','a.close', function(){ 
var item=($(this).closest("li[id^='inv-']")).attr('id'); 
var id = parseInt(item.replace("inv-", "")); 
$.ajax({ 
    type: "POST", 
    url: "ajax-invi.php", 
    dataType: "html", 
    data: "id="+idboda+"&idinv="+id+"&borrar=ok", 
    success: function(data) { 
    noty({"text":"El invitado ha sido borrado"}); 
    $("body").find('li#inv-' + id).remove(); 
    } 
    }); 
});

通過這種方式，您可以將事件處理委託給當DOM加載並處理元素事件時存在的ul ents通過AJAX添加。如果UL不存在，當DOM加載，你可以委託給<body>標籤

編輯 - 生活（），它實際上是一個包裝周圍on()（之前它是圍繞delegate()的包裝），但委託的情況下，通常處理的window這意味着該事件不得不冒出很多。從jQuery的源

live: function(types, data, fn) { 
    jQuery(this.context).on(types, this.selector, data, fn); 
    return this; 
},

來源

2012-03-26 08:44:22

是的，這正是我需要的。我以爲.on（）會像.live（）那樣工作，爲什麼呢？ – 2012-03-26 08:49:10

@ElaineMarley生活（）實際上是圍繞代表（包裝）（現在是一個包裝周圍（）），任何方式我編輯我的答案與一些背景的資訊 – 2012-03-26 08:52:54

謝謝，我需要學習如何正確地做到這一點 – 2012-03-26 09:04:47

$(document).on('click', 'li[id^="inv-"] a.close', function(){ 
//... 
});

所以兩者，你追加事件，一些父元素，看起來對於其存在於網頁加載並將在未來追加的兄弟姐妹。

來源

2012-03-26 08:47:52 Smileek

使用.on添加內容的jQuery事件？

回答

相關問題