1

我慢慢的要疯了。我正在尝试在网页上放置文本自动收报机。它会在显示器上运行，甚至不会连接鼠标。它只是显示建筑物周围的一些信息。我想补充一件事，我认为这是个好主意。底部的滚动文本消息，少数人可以编辑。

我之所以使用它，是因为它是唯一一个看起来滚动得足够流畅且不那么神秘，以至于我需要在开发团队中才能理解。

因为我不能只更改 div 文本并让爬虫滚动它。我试图将它放在更新面板中，在渲染时设置 div 文本并重新启动爬虫。控制消息的 div 位于名为“crawlerUpdate”的 UpdatePanel 中 msgString 是我用来保存的全局 Javascript 变量div 重置时的值。

我已经设置var oCrawlerUpdate = setInterval(function () { updateCrawler() }, 10000);为每 10 秒更新一次消息（仅用于测试，轮询会更长）

我的更新爬虫看起来像：

    function updateCrawler(){
        msgString = '';
        $.getJSON('getCrawlerText.aspx', function (data) {
            $.each(data, function (index, elem) {
                msgString += index + 1 + '. ' + elem.message + '- - -';
            });

            if ($('#textCrawler').html() != msgString)
                __doPostBack("<%= this.postBackVehicle.UniqueID %>", "");
        });
    }

这就是我开始失去它的地方。这有点超出我的理解，但它有点工作。我必须注册一个启动脚本。我假设在更新面板回发时被注入并执行。

 ScriptManager.GetCurrent(this).RegisterAsyncPostBackControl(this.postBackVehicle);
 ScriptManager.RegisterStartupScript(this.crawlerUpdate, this.GetType(), "reInitCrawler", "if(!msgString)msgString=\"Loading ticker message...\";$(\"#textCrawler\").html(msgString);initCrawler()", true);

它在 Firefox 中 100% 运行。我更改了数据库中的消息，在接下来的 10 秒内，滚动条会重新启动并显示新消息。当我在人们将要使用的 IE7 中加载它时，我在 jQuery(1.4.1) 文件中的某处而不是在我的代码中得到一个未定义的错误，我不知道从哪里开始。很久以前，当我进行测试时，每次添加滚动条之前，我都能让 div 显示新消息。我可以在 div 中看到消息闪烁，但 IE 立即出错。

我还应该指出，onLoad div 是空白的，并且第一次通过它就可以工作。它会滚动我的加载消息，直到 10 秒后第一次轮询。我几乎可以肯定，我正在使这比需要的难度成倍增加，但我不知道。

我仍在谷歌搜索其他滚动工具，但这和我一样接近，我想了解为什么 IE 让我消化不良。我知道 IE 是一个善变的野兽，我希望它是相当容易的。我很接近，我想继续前进。

编辑：我没有完全使用提供的答案，但我转储了滚动库并使用了两个函数。

    function resetCrawler() {
        var contWidth = $('#scrollContainer').width();
        var blockWidth = $('#textCrawler').width();
        var moveLen = (contWidth + blockWidth) * -1
        var timeFigure = (-1 * moveLen)/.05;
        //console.log("Container: " + contWidth + " Block: " + blockWidth + " MovementSpan: " + moveLen + " TimeSpan: " + timeFigure);

        $('#textCrawler').html(msgString).css('left', contWidth).animate({ left: moveLen }, timeFigure, 'linear', function () { resetCrawler() });
    }

    function updateCrawler(){
        msgString = '';
        $.getJSON('getCrawlerText.aspx', function (data) {
            $.each(data, function (index, elem) {
                msgString += index + 1 + '. ' + elem.message + '- - -';
            });

            if ($('#textCrawler').html() != msgString) {
                resetCrawler();
            }
        });
    }

我只是进行了每毫秒 px 的计算，无论消息有多长，它都以相同的速度滚动。我怀疑我遇到了与您发布的链接相同的问题，即我在 jQuery 中调用了一些东西。我只是在完成时再次调用它，这取决于内部 div 的宽度。还有更多工作要做，但我认为它已经足够好了......

感谢您的帮助。

4

1 回答 1

0

我完全支持服务器端代码，而且我大部分时间都反对计时器，但是如果你所做的只是滚动一些文本并且你没有鼠标输入也没有其他需要运行的脚本，为什么不直接使用计时器？

明确设置您的 AJAX 调用不缓存结果，并使用计时器每隔一段时间调用您的 AJAX 以更新您的文本。

我在这里看到的唯一问题是确保您仍然流畅地滚动，而计时器不会影响执行移动的能力。


更新：我发现这篇文章实际上告诉你如何做到这一点，使用一个与你想要做的事情相匹配的例子。


如果您对此有任何疑问，请告诉我。祝你好运！:)

于 2013-04-11T13:54:33.793 回答