Question

我无法弄清楚如何让它发挥作用。我有一个绘图表，我想在一行的每一列中做一个固定的跳转。

这是我表的一部分：

        <tr>
            <td>First</td>
            <td>Second</td>
            <td>Third</td>
            <td>Fourth</td>
        </tr>

        <tr class="r1">
            <td><div class="col1"><img src="1.bmp"></div></td>
            <td><div class="col2"><img src="2.bmp"></div></td>
            <td><div class="col3"><img src="3.bmp"></div></td>
            <td><div class="col4"><img src="4.bmp"></div></td>
        </tr>

        <tr class="r2">
            <td><div class="col1"><img src="3.bmp"></div></td>
            <td><div class="col2"><img src="1.bmp"></div></td>
            <td><div class="col3"><img src="2.bmp"></div></td>
            <td><div class="col4"><img src="4.bmp"></div></td>
        </tr>

我想这样按下箭头键（左/右）并转到行中的上一个/下一个列。当我按（向上/向下）或滚动（向上/向下）时，我希望页面跳转到下一行图像。每次跳转时，我都希望文档的左上角对齐在doc上的相同位置。

我试过使用像：

这样的东西

var i = 1;
$(window).click(function() {
    $(window).scrollLeft($("r2:nth-child(" + i + ")").position().left);
    i++;
});

和

$('r2').scroll(function(){
    var left = $(this).offset().left,
    top = $(this).offset().top;
    window.scrollTo(0, top);
});

但我无法让它发挥作用。我假设我需要一个合适的函数来实现这样的东西：

document.onkeydown = function(e) {
    switch (e.keyCode) {
        case 37:
            //jump to plot on right if < 4
            break;
        case 38:
            //jump to plot above if not top row
            break;
        case 39:
            //jump to plot on left if > 1
            break;
       case 40:
            //jump to plot below if not last row
            break;
   }
};

Answer 1

写一个句点字符，后跟每个类的名称，如r2，例如：

$(".r2")

移动图像表

1 个答案: