javascript - 使用键盘切换或滚动固定高度的 HTML 表格单元格

标签 javascript html css browser section508

我需要为单元格高度固定的 HTML 表格添加键盘访问。也就是说,如果滚动条出现在单元格中(给出的示例),键盘需要能够使用箭头键滚动该单元格。我怎样才能做到这一点?我需要支持 Internet Explorer 6、7 及更高版本。

非常感谢您的提前帮助。

表格示例:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html lang="en">
        <head>
            <title>Simplified</title>
        </head>
        <body>
        <table width="100%" cellspacing="0" cellpadding="0" border="1" BGCOLOR="#E8E8E8">
            <tr align="center">
            <td valign="top">
                <strong>List</strong>
            </td>
            </tr>
            <tr align="center">
            <td>
                <table width="100%" border="1" cellspacing="0" cellpadding="2" id="reasonList">
                    <tr>
                    <th scope="row" width="15%">
                        <span class="workArea">
                        <a href="http://www.somewhere.com/someHTML.html"><nobr>Entry Number</nobr></a>
                        </span>
                    </th>
                    <td width="20%" align="center">
                        <span class="workArea">
                        <nobr>ALL</nobr>
                        </span>
                    </td>
                    <td width="10%" align="center">
                        <span class="workArea">
                        <nobr>A</nobr>
                        </span>
                    </td>
                    <td width="10%">
                        <span class="workArea">
                            <nobr>B</nobr>
                        </span>
                    </td>
                    <td width="35%" align="left">
                        <div style="overflow:auto; width: 330px; height: 110px;">
                            <span class="workArea">
                                            Returned Customer<br>
                                            Refund Requested<br>
                                            Change of Address<br>
                                            Denied Delivery<br>
                                            Expedited processing<br>
                                            Data Entry Errors<br>
                                            Not Ready for Delivery<br>
                                            Other Notices<br>
                                            Billing Error<br>
                                            Shipping Error<br>
                                            Rejected Delivery<br>
                            </span>
                        </div>
                    </td>
                    <td width="15%">
                        <span class="workArea">
                        <nobr>07/15/2012</nobr>
                        </span>
                    </td>
                    </tr>
                </table>
            </td>
            </tr>
        </table>
        </body>
    </html>

最佳答案

您应该能够通过向相关单元格添加 tabindex="-1" 来获得单元格焦点。

关于javascript - 使用键盘切换或滚动固定高度的 HTML 表格单元格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13879703/

相关文章:

Javascript正则表达式匹配问题

css - 下拉位置

html - 完整背景图片可在Chrome,Opera,Firefox,IE9和10中运行,但不能在IE11中运行

php - 一种形式的两个下拉菜单

javascript - 如何更改 html 页面中每次出现的特定字符的颜色? (例如 '*' )

javascript - jquery 触摸导航

css - 响应式布局与 Clearfix 上的 CSS 问题

javascript - 如何控制按钮单击时的动画功能?

javascript - 多种波本威士忌补充装莫代尔

javascript - 使用 AMD 模块时,避免在 Typescript 中重复引用/导入外部 javascript 库