Binding функции нажмите на динамические дивы

Question

Там будет число таких DIV, созданных с уникальным сНом идентификатором, , когда я нажимаю на кнопку со мной он должен показать оповещение для этого ProductID, я делаю это как

<div id="xyz{productid}"> 
    Click Me 
</div> 
..... 
<script type="text/javascript"> 
    var uuid="{productid}" 
</script> 
<script src="file1.js"> 

кода из file1.js

$(function() { 
    var d = "#xyz" + uuid; 
    $(d).click(function() { 
     alert("Hello" + uuid); 
     return false; 
    }); 
    alert(d); 
}); 

Так код также хорошо, но основная проблема с ним, так как им делать это на странице категории, где у нас есть ряд продуктов, эта функция становится связана с последним продуктом только плитка , Я хочу, чтобы он был связан с этим конкретным подразделением только там, где он был назван

............................ .. получил решение извините за поздний ответ, был в выходные дни, но я решил его по типу класса, где мы создаем объект с каждым фрагментом на странице, а во время загрузки страницы мы инициализируем все его классовые классы, так что вы можете получить индивидуальный Див идентификатор и когда привязать функцию к нему, по-прежнему может использовать данные из своих переменных класса, им разместить свой код здесь, так что если один хочет может использовать его,

UniqeDiv= new function() 
{ 
var _this = this; 
var _divParams = null; 
var _uuid=null; 
//constructor 
new function(){  

//$(document).bind("ready", initialize); 

//$(window).bind("unload", dispose); 


_uuid=pUUID; 

initialize(); 

$('#abcd_'+_uuid).bind("click",showRatingsMe) 

dispose(); 


} 

function initialize(){ 

} 
function showRatingsMe(){  
    alert(_uuid);  
} 
function dispose(){ 
    _this = _divParams = null 
} 
} 
//In a target file, im including this js file as below 
<script type="text/javascript"> 
    var pUUID="${uuid}";   
</script> 
<script type="text/javascript" src="http://localhost:8080/..../abc.js"></script> 

Answer 1

вы можете использовать attribute selector with starts with дикая карта с jQuery on() для привязки события click для динамически добавленных элементов.

$(document).on("click", "[id^=xyz]", function(){ 
    //your code here 
    alert("Hello"+this.id); 
    return false; 
}); 

Answer 2

Я бы добавил класс к каждому из ваших динамических div, чтобы их было проще запросить. В следующем примере я использую класс dynamic, чтобы пометить теги div, которые добавлены динамически и должны иметь этот клик-прослушиватель.

Чтобы прикрепить событие, вы можете использовать делегированные события с функцией jQuery on(). Делегирование события будет срабатывать для текущих и будущих элементов в DOM:

$(function() { 
    var d="#xyz"+uuid; 
    $(document).on('click', 'div.dynamic', function() { 
     alert("Hello"+uuid); 
     return false; 
    });  
}); 

Вы можете прочитать больше о делегировании событий here.

Answer 3

Вы можете использовать

$ ("[ID * = 'DIVID _']") нажмите (функция() {} ).

, но для этого вам нужно убедиться, что все идентификаторы div начинаются с «div_».