Question

我已经尝试了所有我能想到的事情，以便在div标签上滚动时触发此事件。我确信它实际上已经达到了这个代码而且确实如此。滚动时它永远不会触发。我也尝试过使用.scroll（...）和.bind（'scroll'...）对这个问题有什么看法？

$('.ScrollIEContainer').scroll(function ()
{
   var scrollPos = $(this).scrollTop();
   if (scrollPos != null && scrollPos != undefined)
   {
      $(this).contents('table.GridView').children('thead').children('tr').css({ 'top': scrollPos + 'px' });
   }
});

此处的目标是更新网格视图中标题的顶部位置，以实现固定标题滚动。

更新：由于一些莫名其妙的原因，我无法调试任何此代码，但警报语句除外，但我能够通过在它之前插入一行代码来调试并使用监视窗口检查我的选择器元素，这将导致空引用异常（WTF）。无论如何，我在我的元素中查看了dom，并且在执行上面的代码之后onscroll事件是null事件。

Answer 1

jQuery的live不支持scroll

您的元素是否已动态添加？

<强>编辑：

将$(this).topScroll()更改为$(this).scrollTop()

Answer 2

这是一个带div的工作示例。请注意，标题位置相对于其父级。你的问题可能只是因为thead没有回应这种定位。

<html>
<head>
    <style type="text/css">

        .fixed-div {
            width: 200px;
            height: 100px;
            background-color: grey;
            overflow: auto;
        }

        .header {
            text-align: center;
            width: 100%;
            height: 20px;
            background-color: red;
            position: relative;
        }
    </style>

    <script type="text/javascript" src="jquery-1.4.4.min.js"></script>
    <script type="text/javascript">

        $(document).ready(function () {
            $(".fixed-div").scroll(function(event) {
                var y = $(this).scrollTop();
                var x = $(this).scrollLeft();
                $(".header").css({
                    top: y,
                    left: x
                });
            });

        });

    </script>
</head>

<body>
    <div class="fixed-div">
        <div class="header">Header</div>
        <ul>
            <li>0</li>
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
        </ul>
    </div>

</body>

</html>

滚动事件不在IE中的div元素上触发

2 个答案: