Javascript JS:更改过滤器后无法获取对象
因此,我有一个带有锚定Javascript JS:更改过滤器后无法获取对象,javascript,jquery,html,Javascript,Jquery,Html,因此,我有一个带有锚定a的项目列表,它成功地侦听了以下事件: $('body[data-link="media"] #media_content a').on('click',function(e){ e.preventDefault(); var page = $('.page.active a')[0].innerHTML; var date = $('.year_sorting .filter_years').val(); var id = $(e.curr
a
的项目列表,它成功地侦听了以下事件:
$('body[data-link="media"] #media_content a').on('click',function(e){
e.preventDefault();
var page = $('.page.active a')[0].innerHTML;
var date = $('.year_sorting .filter_years').val();
var id = $(e.currentTarget).data('media');
window.location.href = 'http://'+basePath+'media/content/'+id+'?date='+date+'&page='+page;
})
但是,在同一页面中,有一个过滤器允许用户更改年份过滤器,一旦更改,下面的代码将执行并附加一个项目列表,该列表的布局与上面的$('body[data link=“media”]#media_content a')
完全相同。过滤器事件如下所示:
$('.activity.filter_years').on('change',function(){
$('.pagination_ul').remove();
r_year = $(this).val();
$.get("media/getActivity",{type:'0',key:r_year}).done(function(d){
if(d.length>0){
$('#media_content').html('');
var ul = '<ul class="ap pagination-sm pagination_ul"></ul>';
$('.pagination_menu').append(ul);
for(var i=0;i<d.length;i++){
var p = ['',''];
if(!d[i].event_period){
p = ['style="color:#8A8A8A;"','style="color:#C7C7C7;"'];
}
if(locale=='en'){
var event = $('<div class="div_media_content_f2 '+d[i].pagination+' pagination-tr"> <a href="media/content/'+d[i].event_id+'" data-media="'+d[i].event_id+'"> <div class="div_media_content_f2_3"> <span class="font12_bold">'+d[i].event_date+'</span> <div>'+d[i].event_title+'</div></div></a></div>')
}else if(locale=='hk'){
var event = $('<div class="div_media_content_f2 '+d[i].pagination+' pagination-tr"> <a href="media/content/'+d[i].event_id+'" data-media="'+d[i].event_id+'"> <div class="div_media_content_f2_3"> <span class="font12_bold">'+d[i].event_date+'</span> <div>'+d[i].event_title_zh+'</div></div></a></div>')
}else {
var event = $('<div class="div_media_content_f2 '+d[i].pagination+' pagination-tr"> <a href="media/content/'+d[i].event_id+'" data-media="'+d[i].event_id+'"> <div class="div_media_content_f2_3"> <span class="font12_bold">'+d[i].event_date+'</span> <div>'+d[i].event_title_cn+'</div></div></a></div>')
}
$('#media_content').append(event);
}
pagination('.pagination_ul','.pagination-tr',Math.ceil(d.length/20),false);
}else{
$('#div_news_content_right').html('').append('<div class="not_available">No content available</div>');
}
})
})
$('.activity.filter_years')。在('change',function()上{
$('.pagination_ul').remove();
r_year=$(this.val();
$.get(“media/getActivity”,{type:'0',key:r_year}).done(函数(d){
如果(d.长度>0){
$(“#媒体内容”).html(“”);
var ul='
;
$('.pagination_menu')。追加(ul);
对于(var i=0;i可能很简单,试试这个
$(document).on('click', 'body[data-link="media"] #media_content a')
如果您的元素是动态创建的,您应该绑定文档上的单击事件,并将目标设置为应该分派事件的元素。这与绑定仅单击元素不同,因为在删除元素时事件将解除绑定
更新:
我不确定我是否理解了你所有的脚本,但我试图简化这个问题。
这就是jsbin及其正确工作
在附件后再次绑定您的点击事件您的意思是将点击事件代码放在附件后吗?我刚刚尝试过,但也没有成功。您可以提供JSFIDLE,我可以更新您的代码吗?谢谢@JagjeetSingh,问题已经解决。无论如何,谢谢您的努力!谢谢@jerry\p的回答。$(文档)。关于('click','body)[data link=“media”]#media#u content a',function(e){
{
,当我进入页面时,它会执行这样的事件并跳转到另一个页面。抱歉@jerry_p,我的意思是它没有完全工作。事件在我单击a
时没有发生,但在我加载页面时..你的意思是你没有单击任何东西,它会跳转页面?没错,我所做的只是在浏览器中插入url,输入,输入t进入页面一秒钟,事件执行并跳转到另一页。它现在可以工作了,不知怎么的,我所说的对象可能不够明确?我将'#media_content a'
更改为#media_content>div>a'
,然后它就可以工作了,尽管这对我来说似乎没有什么区别。。。