$（this）不適用於動態創建的元素

我將輸入字段附加到動作的div上。當我嘗試使用$(this).val()訪問輸入字段內的值時，我只是獲取空值。

$('#div').append('<td class = "fund-amount"><input type="number" class="custom-amount" id='+value.response_code+' placeholder="Rs."></td>');

根據動作，可以有任何數量的輸入字段附加到div。我想獲取每個字段上輸入的值。當我試圖使用下面的這種方法獲得價值時，它沒有成功。但是，當我得到的值動態創建的ID和在$(this)的地方使用它的工作

$(document).keyup('.custom-amount',function(){ 
    console.log($(this).val()); //just logging empty 
    console.log($(this).attr('id')); //Logged undefined 

    })

，但是這一個工程

$(document).keyup('#100520',function(){ 
    console.log($('#100520').val());//works 
    console.log($('#100520').val());//works 
});

有什麼毛病我的方法呢？

來源

2017-04-17 Naveen Kumar

這是更多的是一個方面的評論，但是你真的不應該在你的事件處理中重載'document'，而是將它綁定到一個更接近於祖先的元素。 – vol7ron

另一方評論。將表格單元格附加到div是不是很好的想法標記。 – gforce301

創建一個[mcve]，重現問題 – charlietfl

$(document).on('key-up','.custom-amount',function(){ 
    console.log($(this).val()); //just logging empty 
    console.log($(this).attr('id')); //Logged undefined 

    })

來源

2017-04-17 13:55:14 ProgrammerV5

你試過嗎？

$(document).on('keyup', '.custom-amount', function(){ 
    console.log($(this).val()); 
    console.log($(this).attr('id')) 
});

來源

2017-04-17 13:55:21 ssilas777

試試下面的代碼

$('#div').append('<td class = "fund-amount"><input type="number" class="custom-amount" id='+100520+' placeholder="Rs."></td>'); 
 

 
$('.custom-amount').keyup(function() { 
 
    console.log($(this).val()); // value 
 
    console.log($(this).attr('id')); // id 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id= "div"> 
 
</div>

這裏是工作的jsfiddle： https://jsfiddle.net/cm4rLvq1/

來源

2017-04-17 13:57:16 selvarajmas

在調用您的處理程序$(this)工作正常。因爲您正在處理像這樣的事件$(document).keyup您的處理程序在document元素上調用，而不是在元素本身上調用，因此this指向document。

但是，當你提供事件ARG對象到您的處理功能，您可以使用它的屬性target將參考觸發事件，像這樣的元素：

$(function() { 
 
    $(document).on("keyup", ".custom-amount",function(e){ 
 
    console.log($(e.target).val()); 
 
    console.log($(e.target).attr('id')); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" class="custom-amount" id="some-id" />

來源

2017-04-17 14:00:24 xxxmatko

$（this）不適用於動態創建的元素

回答

相關問題