Appgyver - JQuery 单击不适用于动态写入的项目
Appgyver - JQuery on click not working for dynamically written items
我正在使用 appgyver (javascript) 编写单页应用程序。有许多列表是使用 javascript 动态编写的(在外部 API 调用之后)。每个列表都包含一个项目,当单击/按下时,我想触发不同的 js 方法。
function write_a_list(some_array)
{
$('#some_list').html("");
for ( indexor =0; indexor < some_array.length; indexor++)
{
var this_option_div = $('<div>');
this_option_div.addClass('item');
this_option_div.addClass('some_list_item');
this_option_div.html("Button: " + indexor);
$('#some_list').append(this_option_div);
}
}
$(document).on('click', '.some_list_item', function()
{
supersonic.logger.debug('some_list_item clicked');
alert('some_list_item clicked');
});
例如,一个数组被传递给write_a_list函数。如果单击某个项目,则应检测到它并发出警报。但是,未观察到此行为。有没有一种方法可以使用 jquery 'on' 方法来实现?
您正在使用 this_option_div.addClass('some_list_item');
,然后在可能不存在的 ID 上调用点击事件。
改为:
$(document).on('click', '.some_list_item', function() { ... }
EDIT ////
你能试试最接近的不是动态的父选择器而不是文档吗?
$('.static-wrapper').on('click', '.some_list_item', function() { ... }
我正在使用 appgyver (javascript) 编写单页应用程序。有许多列表是使用 javascript 动态编写的(在外部 API 调用之后)。每个列表都包含一个项目,当单击/按下时,我想触发不同的 js 方法。
function write_a_list(some_array)
{
$('#some_list').html("");
for ( indexor =0; indexor < some_array.length; indexor++)
{
var this_option_div = $('<div>');
this_option_div.addClass('item');
this_option_div.addClass('some_list_item');
this_option_div.html("Button: " + indexor);
$('#some_list').append(this_option_div);
}
}
$(document).on('click', '.some_list_item', function()
{
supersonic.logger.debug('some_list_item clicked');
alert('some_list_item clicked');
});
例如,一个数组被传递给write_a_list函数。如果单击某个项目,则应检测到它并发出警报。但是,未观察到此行为。有没有一种方法可以使用 jquery 'on' 方法来实现?
您正在使用 this_option_div.addClass('some_list_item');
,然后在可能不存在的 ID 上调用点击事件。
改为:
$(document).on('click', '.some_list_item', function() { ... }
EDIT ////
你能试试最接近的不是动态的父选择器而不是文档吗?
$('.static-wrapper').on('click', '.some_list_item', function() { ... }