weixin_33737774 2018-04-20 12:33 采纳率: 0%
浏览 25

jQuery关于更改AJAX问题

I have the following scenario:

I have a table that is populated with user data like name, surname, location and courses in a structure like the following:

<tr>                          
   <td data-label="First Name" class="wppb-name"><span>Mutanga</span></td>
   <td data-label="Last Name" class="wppb-name"><span>Eto Emule</span></td>         
   <td data-label="Location" class="wppb-name"><span>Somewhere</span></td> 
   <td data-label="Courses" class="wppb-name seminaria-multiselect">Course 1, Course 2, Course 3, Course 4, Course 5, Course 6</td>                    
</tr>

The courses are fetched in a long line of text with no separation which i dont want neither i can insert span elements manually to each course. I change it with the following jQuery snippet. This separates the courses and insert them into spans and it works.

$('.seminaria-multiselect').each(function() {                   
    $(this).html($(this).html().split(', ').map(function(el) {
        return '<span>' + el + '</span>';
    }));        
});

Now the problem is that when i apply filters (for example, filter the users for specific locations or specificcourses), it does the filtering using AJAX and it loses the 'span formatting' of the above snippet.

I understand that this can be solved using the on() method, something like this:

$(document).on('change', '.seminaria-multiselect', function() { 
    $('.seminaria-multiselect').each(function() {                   
        $(this).html($(this).html().split(', ').map(function(el) {
            return '<span>' + el + '</span>';
        }));        
    });
});

This snippet however does not work properly all by itself. When the page is loaded, the text is not separated into spans neither after applying filters.

If i keep both the snippets like so:

$('.seminaria-multiselect').each(function() {                   
    $(this).html($(this).html().split(', ').map(function(el) {
        return '<span>' + el + '</span>';
    }));        
});         
$(document).on('change', '.seminaria-multiselect', function() { 
    $('.seminaria-multiselect').each(function() {                   
        $(this).html($(this).html().split(', ').map(function(el) {
            return '<span>' + el + '</span>';
        }));        
    });
});

then it applies the span separation on page load but filtering still doesn't produce the result i want.

Q1) What should i correct in order to make it work? Q2) Is there a more efficient way to do this? Is it necessary to keep both snippets (the first one when the page loads and 2nd one for when it filters)

I thank you very much for your time :)

  • 写回答

1条回答

      报告相同问题?

      相关推荐 更多相似问题

      悬赏问题

      • ¥15 GEO下载数据的处理报错 :函数‘Meta’标签‘"data.frame"’找不到继承方法,如何解决?
      • ¥15 DLNM模型是否可以用二分类变量作为y变量
      • ¥15 android object box 一个实体多个表怎么写
      • ¥15 temux 启用docker 服务失败
      • ¥15 Flask 使用celery发送邮件出现‘目标计算机积极拒绝‘
      • ¥60 老人用的sd卡在手机里面不知道操作了什么,导致图片和视频变成了文件,取下sd卡连接电脑就是图中的样子,后缀改为.jpg才可以,需要用系统的画图软件才能打开,文件属性还是文件,有没有批量操作的解决办法
      • ¥15 超时跳出方法代码的返回值问题
      • ¥15 汇编语言程序设计设计,ascii码求数,再求数的BCD码
      • ¥30 Mask rcnn训练自己的数据集出现问题!
      • ¥20 研究人工智能时的几个问题