0

我有通过 ajax 请求生成的工具提示（ https://github.com/iamceege/tooltipster ），其中包含供用户单击的图标。但是，当事件被触发时，我无法让监听器工作。在下面的代码中，我从来没有收到警报弹出窗口。如何获取工具提示中的事件？

这是我初始化工具提示器的方式：

$('.share').tooltipster({
    content: 'Loading...',
    contentAsHTML: true,
    interactive: true,
    position: 'bottom',
    trigger: 'click',
    functionBefore: function(origin, continueTooltip){
        continueTooltip();
        if(origin.data('ajax') !== 'cached'){
            var id = $(this).attr('id'),
                datas = id.split('-'),
                type = $(this).attr('data-type');

            if(type != 'pack' && type != 'life'){
                type = 'event';
            }

            var shareType = $(this).attr('data-share-type'),
                q = 'id='+datas[1]+'&t='+type+'&st='+shareType;

            Site.Funcs.ajaxCall('social', q, function(data){
                var html = Site.Funcs.templateCall(data);
                origin.tooltipster('content', html).data('ajax', 'cached');
                origin.tooltipster('show');
            });
        }
    }
});

这是被 Site.Funcs.templateCall() 解析后更新到工具提示的内容：

<div class="row">
    <div class="large-12 columns">
        <button id="facebook" class="zocial icon facebook" data-share-type="question" data-type="event" data-id="1"></button>
        <button id="twitter" class="zocial icon twitter" data-share-type="question" data-type="event" data-id="1"></button>
        <button id="google" class="zocial icon google" data-share-type="question" data-type="event" data-id="1"></button>
        <button id="instagram" class="zocial icon instagram" data-share-type="question" data-type="event" data-id="1"></button>
    </div>
</div>

最后，点击事件的监听器：

$(document).delegate('button.icon', 'click', function(){
    alert('icon!');
});
4

1 回答 1

0

您必须在模板位于文档中之后创建事件。

Site.Funcs.ajaxCall('social', q, function(data){
     var html = Site.Funcs.templateCall(data);
     origin.tooltipster('content', html).data('ajax', 'cached');
     origin.tooltipster('show');
     $(document).delegate('button.icon', 'click', function(){
         alert('icon!');
     });
});

使用您的代码，事件是在异步 ajax 调用之外创建的，因此可以说它错过了您的工具提示。

于 2014-10-03T05:06:14.707 回答