使用jquery獲取元素id

代碼應該打印所選div的id，但它不會。我沒有發現錯誤。感謝幫助。使用jquery獲取元素id

HTML

<body> 
    <div id="form_area"> 
     <div> 
     <button onclick="return add_row();" style="width:100%;">Add Row</button> 
     </div> 
    </div> 
</body>

的Javascript

$(document).ready(function() { 
    $('#form_area div').click(function(e) { 
     console.log($(this).attr('id')); 
    }); 
}); 

function add_row() { 
    var random_id = Math.floor((Math.random() * 1000) + 1); 
    $('#form_area').prepend('<div id="' + random_id + '" class="form_row"></div>'); 
}

來源

2013-11-20 Cem

裏面'＃form_area'沒有一個ID – Krishna

股利當您使用jQuery的，爲什麼不一致使用它？ http://jsfiddle.net/tVPX8/2 – karthikr

@karthikr你忘記刪除內聯事件處理程序 – Alnitak

好吧，我想我明白你失去了什麼。您嘗試在使用add_row函數添加一行之後記錄ID，

.form_row被動態添加到DOM。所以執行$('.form_row').click(時，沒有.form_row來綁定處理程序。使用.on方法的下面的方式結合所述處理程序來#form_area並執行只有當點擊事件是從.form_row

$('#form_area').on('click', '.form_row', function() { 
    console.log(this.id); 
});

$('#form_area div')選擇在div #form_area內的div不具有一個ID

處理程序

下面的評論在html顯示哪個div被選中，

<div id="form_area"> 
    <div> <!-- $('#form_area div') selects this div--> 
     <button onclick="return add_row();" style="width:100%;">Add Row</button> 
    </div> 
</div>

來源

2013-11-20 19:07:01

我試過$（'。form_row'）。click（function（e）too但它也不起作用。 – Cem

@Cem （'＃form_area'）。prepend ... line添加它們。 –

$（'＃form_area'）。 '，'.form_row'，function（）有效，但是我的方法有什麼問題？ – Cem

要訪問ID使用「上」是動態生成您的DIV：

$(document).ready(function() { 
    $('#form_area').on('click', '.form_row', function() { 
     console.log(this.id); 
    }); 
});

來源

2013-11-20 19:10:08

我添加行添加行按鈕，當我點擊新添加的行，它不起作用。 – Cem

首先，你有jQuery的 - 你應該用它來註冊的，而不是使用過時的，容易出錯的內聯事件處理程序的事件處理程序。

其次，您的按鈕處理程序位於#formarea之內，因此也會觸發點擊處理程序，因爲該按鈕的父級沒有ID。這可能是不希望的。

第三，您的事件處理程序需要委託，因爲您試圖捕獲動態添加的元素上的事件。

因此，除去onclick屬性和補充一點：

$('#formarea button').on('click', addRow); 

$('#formarea').on('click', '.form_row', function() { // delegated, for dynamic rows 
    console.log(this.id);       // NB: not $(this).attr('id') !! 
}); 

function addRow(ev) { 
    // unmodified 
}

見http://jsfiddle.net/alnitak/aZTbA/

來源

2013-11-20 19:18:42 Alnitak

這也工作。謝謝。 – Cem

嘗試console.log($('#form_area div').attr('id'));

來源

2013-11-20 19:20:15 Slowcoder

使用jquery獲取元素id

回答

相關問題