我想在android webview中显示一个表格,它要求表格可以水平和垂直滚动。


body {
    margin: 0px;
}

table {
    border-collapse: collapse;
    margin-bottom: 3em;
    background: #fff;
}

td, th {
    padding: 0.75em 1.5em;
    text-align: left;
}

    td.err {
        background-color: #e992b9;
        color: #fff;
        font-size: 0.75em;
        text-align: center;
        line-height: 1;
    }

th {
    background-color: #31bc86;
    font-weight: bold;
    color: #fff;
    white-space: nowrap;
}

.thead {
    position: fixed;
}

tbody th {
    background-color: #2ea879;
}

tbody tr:nth-child(2n-1) {
    background-color: #f5f5f5;
    transition: all .125s ease-in-out;
}

tbody tr:hover {
    background-color: rgba(129,208,177,.3);
}

<table >
        <thead>
            <tr>
                <th>产品ID</th>
                <th>产品编码</th>
                <th>产品名称</th>
                <th>产品规格</th>
                <th>配置</th>
                <th>配置1</th>
                <th>配置2</th>
                <th>单价</th>
                <th>折扣</th>
            </tr>
        </thead>
        <tbody>

            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>33333333333333333333333333333333333333333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
            <tr>
                <td>1</td>
                <td>A86</td>
                <td>产品1</td>
                <td>10X10</td>
                <td>sfsdfsdfsdfsdfs</td>
                <td>333333333333333</td>
                <td>1923</td>
                <td>0.9</td>
                <td></td>
            </tr>
        </tbody>
    </table>





我尝试使用[StickyTableHeaders] [1]

[1]:https://github.com/jmosbech/StickyTableHeaders,它可以在我的Windows chrome中使用,但是当调用webView.loadUrl时它不能在Android中使用,看来js在android中无法使用,l​​ogcat显示“ Uncaught TypeError:Object [object对象]没有方法'stickyTableHeaders'。有人可以帮我解决这个问题:)

最佳答案

默认情况下未启用JavaScript。您必须通过以下方式启用它:

webview.getSettings().setJavaScriptEnabled(true);

关于javascript - 如何在Android WebView中固定表头,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/30919713/

10-12 04:09