Question

我在项目中使用了footable插件。

但是，它不能与手机屏幕一起工作。首先，我改变了Chrome开发工具的屏幕尺寸，这样做很好，

但是当我的代码在手机屏幕上重做时它无效。就像这样

我的HTML代码;

       <div id="tablelistDiv">
       <div class="row">
       <table id="tbl_search" class="footable" data-page-size="20">
        <thead>
            <tr>
                <th data-toggle="true" data-sort-ignore="false">Sıra No</th>
                <th data-sort-ignore="false">Ünvan</th>
                <th data-hide="phone" data-sort-ignore="false">Şube</th>
                <th data-hide="phone" data-sort-ignore="false">Broker</th>
                <th data-hide="phone" data-sort-ignore="false">Durum</th>
                <th data-hide="phone" data-sort-ignore="false">Kayıt Tar.</th>
                <th data-hide="phone" data-sort-ignore="true"><i class="fa fa-search"></i></th>
            </tr>
          </thead>
          <tbody>
          </tbody>
          <tfoot>
          <tr>
           <td colspan="7">
             <div class="pagination pagination-centered hide-if-no-paging"></div>
           </td>
          </tr>
         </tfoot>
     </table>
    </div>
    </div>

我的Js代码是，

function detayKayitlar(jsondata, status) {
                    obj = JSON.parse(jsondata);
                    var tableHtml = "";
                    for (var i = 0; i < obj.length; i++) {
                        tableHtml = tableHtml
                            + "<tr>"
                            + "<td>" + obj[i].ID + "</td>"
                            + "<td>" + obj[i].UNVAN + "</td>"
                            + "<td>" + obj[i].SUBE + "</td>"
                            + "<td>" + obj[i].BROKER + "</td>"
                            + "<td>" + obj[i].USERLASMA + "</td>"
                            + "<td>" + obj[i].KAYITTAR + "</td>"
                            + "<td><button onclick='detayKayit(" + obj[i].ID + ",2);' class='btn btn-block btn-danger'  type='button'><i class='fa fa-search'></button></td>"
                            + "</tr>";

                    }

                    $("#tbl_search tbody").append(tableHtml);
                    jQuery(function () {
                        jQuery('#tbl_search').footable();
                    });

                    pWaitHide();
                    hideDiv('search');
                    showDiv('list');
                }

Answer 1

由于你的chrome在桌面上，它运行正常。请检查您在标题标记中添加以下行的天气。此视图端口将检测屏幕大小。

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

Answer 2

你的返工意味着什么？如果你动态地做某事你可以运行$（'＃tbl_search'）。trigger（'footable_redraw'）;

来自@Almis的第一行评论。谢谢

Foo表它不能正常工作的手机屏幕大小

2 个答案: