如何使用 Ajax 响应创建 mootool 工具提示

发布于 2024-11-25 16:04:58 字数 53 浏览 1 评论 0原文

如何使用 Ajax 响应创建 mootool 工具提示。任何人都可以向我推荐一个相同的教程。

How to create a mootool tooltip with Ajax response.Anybody can please suggest me a tutorial for the same.

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

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

发布评论

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

评论(1

你与昨日 2024-12-02 16:04:58

到目前为止你尝试过什么?

顺便说一句,您可以这样做:

parent 可倾斜元素内设置 data -attribute 存储url(需要通过ajax检索工具提示)ie:

<div class="tippable" data-tipurl="/some/url/">
  when I mouseover here, a tip appears
</div>

然后,通过js,创建并缓存提示ie:

$('div.tippable').each(function(tippable){

    tippable.addEvents({

        'mouseenter' : function(){

            if(!this.retrieve('tip')){ //first time, build tip!

                var tip = new Element('div.tip');

                tip.set('load',{/* options */});

                tip.load(this.get('data-tipurl')); //get through ajax 

                tip.inject(this, 'top').setStyles({ //set tip style
                    position : 'absolute'
                    /* etc... */
                });

                this.store('tip', tip); //store it inside the parent

            }else{ // already built, just show it

                this.retrieve('tip').setStyle('display', 'block');
            }
        },

        'mouseleave' : function(){
            var tip = this.retrieve('tip'); //retrieve the tip

            if(tip){ //if it's already built, hide it
               tip.setStyle('display','none'); 
            }

            //otherwise, do nothing
        }

    });
});

What have you tried so far?

You could do this way btw:

Set inside your parent tippable elements a data-attribute to store the url (needed to retrieve the tooltip by ajax) i.e.:

<div class="tippable" data-tipurl="/some/url/">
  when I mouseover here, a tip appears
</div>

Then, by js, create and cache the tips i.e.:

$('div.tippable').each(function(tippable){

    tippable.addEvents({

        'mouseenter' : function(){

            if(!this.retrieve('tip')){ //first time, build tip!

                var tip = new Element('div.tip');

                tip.set('load',{/* options */});

                tip.load(this.get('data-tipurl')); //get through ajax 

                tip.inject(this, 'top').setStyles({ //set tip style
                    position : 'absolute'
                    /* etc... */
                });

                this.store('tip', tip); //store it inside the parent

            }else{ // already built, just show it

                this.retrieve('tip').setStyle('display', 'block');
            }
        },

        'mouseleave' : function(){
            var tip = this.retrieve('tip'); //retrieve the tip

            if(tip){ //if it's already built, hide it
               tip.setStyle('display','none'); 
            }

            //otherwise, do nothing
        }

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