Mootools 工具提示未显示 Request.HTML 内容

发布于 2024-12-12 13:15:15 字数 1231 浏览 6 评论 0原文

我在向 Request.HTML 添加提示时遇到一些问题 功能。我有一个 div 每 30 秒刷新一次其内容。 返回的内容有一系列带有类名的div “.liveReader”。

这是我必须启动内容的 JS

            window.addEvent('domready', initLiveContent);

            function initLiveContent()
            {
                    var tips = new Tips('.liveReader');
                    (function() { refreshPanel() }).periodical(30000);
                    refreshPanel();
            }

            function refreshPanel()
            {
                    var myRequest = new Request.HTML({
                             url: '/inc/liveFeed.aspx',
                             update: $('liveContent'),
                             method: 'get',
                             onComplete: function() {
                                 tips.attach('.liveReader');
                             }
                    });
                    myRequest.send();
            }

所以 HTML 是

<div id="liveContent">
    <div id="item1" class="liveReader" title="item 1"><p>Text 1</p></div>
    <div id="item2" class="liveReader" title="item 2"><p>Text 2</p></div>
</div>

然而我看到的只是正常的工具提示标题!有什么想法吗?

I'm having some trouble with adding tips to a Request.HTML
function. I have a div which refreshes its content every 30 seconds.
The content returned has a series of divs with the class name
".liveReader".

Here's the JS I have to initiate the content

            window.addEvent('domready', initLiveContent);

            function initLiveContent()
            {
                    var tips = new Tips('.liveReader');
                    (function() { refreshPanel() }).periodical(30000);
                    refreshPanel();
            }

            function refreshPanel()
            {
                    var myRequest = new Request.HTML({
                             url: '/inc/liveFeed.aspx',
                             update: $('liveContent'),
                             method: 'get',
                             onComplete: function() {
                                 tips.attach('.liveReader');
                             }
                    });
                    myRequest.send();
            }

So the HTML is

<div id="liveContent">
    <div id="item1" class="liveReader" title="item 1"><p>Text 1</p></div>
    <div id="item2" class="liveReader" title="item 2"><p>Text 2</p></div>
</div>

Yet all I am seeing is the normal tooltip title! any ideas?!!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

洒一地阳光 2024-12-19 13:15:15

您的问题在于变量范围。

您的 onComplete 处理程序使用对 tips 的引用,而此变量是 initLiveContent 函数的本地变量。因此,onComplete 调用失败。

因此,第一个技巧(没有双关语):始终从实际的调试器开始,并将其设置为在所有异常时中断。否则,由于错误(“未定义的变量 tips”)是从回调中引发的,因此它不会出现在标准控制台中。

然后,有两种方法可以修复代码:

  1. 使 tips 成为共享变量。例如,您可以在函数中声明它,该函数将作为 window.addEvent 调用的第二个参数,然后在 initLiveContentonComplete< 中引用它/code> 回调。

  2. 更多 Mooish  :) 
    使用元素存储动态检索您的提示来自更新的容器的实例。即:

    函数 initLiveContent()
    {
        var Tips = new Tips('.liveReader');
            // ...你之前的代码...
        $('liveContent').store('tip', Tips);    
    }
    
    函数刷新面板()
    {
        var 目的地 = $('liveContent');
        var myRequest = new Request.HTML({
            更新:目的地,
                // ...你之前的代码...
            onComplete: 函数() {
                目的地.retrieve('提示').attach('.liveReader');
            }
        });
        myRequest.send();
    }
    

:)

Your problem is with variable scoping.

Your onComplete handler uses a reference to tips, while this variable is local to the initLiveContent function. Therefore, the onComplete call fails.

So, first tip (no pun intended): always start with an actual debugger, and set it to break on all exceptions. Otherwise, since the error ("undefined variable tips") is thrown from within a callback, it won't appear in the standard console.

Then, two ways to fix your code:

  1. Make tips a shared variable. You might for example declare it in a function that would be the second argument to your window.addEvent call, and then reference it in both initLiveContent and your onComplete callback.

  2. Much more Mooish  :) 
    Use Element storage to dynamically retrieve your Tips instance from your updated container. That is:

    function initLiveContent()
    {
        var tips = new Tips('.liveReader');
            // … your previous code …
        $('liveContent').store('tip', tips);    
    }
    
    function refreshPanel()
    {
        var destination = $('liveContent');
        var myRequest = new Request.HTML({
            update: destination,
                // … your previous code …
            onComplete: function() {
                destination.retrieve('tip').attach('.liveReader');
            }
        });
        myRequest.send();
    }
    

:)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文