更改页面或搜索后，jQuery Popover在数据表中不起作用

问题描述

我有Jquery数据表，它显示每一列中数据完整性的百分比。当我将鼠标悬停在<td>上时，将显示数据。它在我的数据表的第一页上起作用，但是当页面更改或搜索数据时它不起作用。我的3列有3个班级。我该如何运作？下面是我的代码：

PHP：

<table id="pic_table" class="table" class="display">
                    <thead>
                        <tr>
                            <th class="filterhead"></th>
                            <th class="filterhead"></th>
                            <th class="filterhead"></th>
                        </tr>
                        <tr>
                            <th>Project Reference</th>
                            <th>Basic Profile</th>
                            <th>Employment Permits</th>                 
                        </tr>
                    </thead>
                    <tbody>
        
        <?PHP  while($row = sqlsrv_fetch_array( $sql_stmt,sqlSRV_FETCH_NUMERIC)){
                                 
                    $pr_stats = intval($row[0]);
                    $bp_stats = intval($row[1]);
                    $ep_stats = intval($row[2]);
                    $userid = $row[3];
                                 
                    echo"<tr>";
                    /************column to show data when hovered*****************/
                    echo "<td class='prbk' data-toggle='popover' data title='".$userid."'>".$pr_stats."%</td>"; 

                    /************column to show data when hovered*****************/
                    echo "<td class='bpbk' data-toggle='popover' data-title='".$userid."'>".$bp_stats."%</td>";

                    /************column to show data when hovered*****************/
                    echo "<td class='epbk' data-toggle='popover' data-title='".$userid."'>".$ep_stats."%</td>";                     
                    echo "</tr>";
                     }
                    echo "</tbody>";
                    echo "</table>";

JS：

 /*******************************Datatable**********************************/
$('#pic_table').DataTable({

    initComplete: function () {
            var i = 0;
                    this.api().columns().every( function () {
                        var column = this;
                        var select = $('<select><option value="">All</option></select>')
                            .appendTo( $('.filterhead').eq(i).empty() )
                            .on( 'change',function () {
                                var val = $.fn.dataTable.util.escapeRegex(
                                    $(this).val()
                                );
             
                                column
                                    .search( val ? '^'+val+'$' : '',true,false )
                                    .draw();
                            } );
             
                        column.data().unique().sort().each( function ( d,j ) {
                            select.append( '<option value="'+d+'">'+d+'</option>' )
                        } );
                        i++;
                    } );        
    }
    
});  

    /*******************************TooltiP**********************************/
             
             $('.prbk,.bpbk,.epbk').popover({
                    title:'Details',content:fetchData,html:true,trigger: 'hover',placement:'right',container: 'body',});
             
             function fetchData(){
                 var fetch_data = '';
                 var element = $(this);
                 var id = element.attr("data-title");
                 var status = element.attr("class");
                
                 $.ajax({
                    url:"fetch_details.PHP",method:"POST",async:false,data:{id:id,status:status},success:function(data){
                        fetch_data = data;
                    }
                 });
                 
                 return fetch_data;
             }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）