繁体   English   中英

jQuery(this)和qtip无法正常工作

[英]jQuery(this) and qtip not working

使用jQuery的qtip插件,我试图显示隐藏的值(已经呈现的颜色悬停在图标上。问题是它只抓取列表中的第一项并在qtip中显示。现在我知道通常的答案是使用“this”选择器来定位它,但在这种情况下,它只是不起作用...

这是代码:

jQuery('li dl dd.job_icons').qtip({
    content: {
      prerender : true,
      text: jQuery('li dl dd.job_icons').html()
    }
});

而且我也尝试过使用它而没有运气:

text: jQuery(this).html()

要获得更清晰的图片,请查看此链接并将鼠标悬停在图标上(某些图标有不同的日期,其他图标也应显示工资和公司名称图标)

提前致谢...

编辑:这是渲染的html

<li class="job job-alt job-featured"> 
 <dl> 
  <dt>Type</dt> 
  <dd class="type"><span class="jtype full-time">Full-Time</span></dd> 

  <dt>Job</dt> 
  <dd class="title"> 
    <strong>
    <a href="http://rockstar.tinygiantstudios.co.uk/jobs/front-end-developer-2/">Front End Developer</a>
    </strong> 
  </dd> 

  <dt>Location</dt> 
  <dd class="location">Anywhere</dd> 

  <dt>Job Admin</dt>    
    <dd class="job_icons"> 
    <div class="job_icons_wrap"> 
     <span class="job_date_detail">7 Feb</span> 
     <a href="#" class="job_date_icon"></a> 

     <a href="http://tinygiantstudios.co.uk" rel="nofollow" class="job_lister_detail">Tiny Giant Studios</a> 
     <a href="#" class="job_lister_icon"></a> 

     <span class="job_salary_detail jtype 100000-and-above">100,000 and above</span>
     <a href="#" class="job_salary_icon"></a> 
 </div>    
 </dd> 
</dl> 
</li>

尝试每个()。 它有适当的范围来使用this

jQuery('li dl dd.job_icons').each(function() 
    jQuery(this).qtip({
        content: {
          prerender : true,
          text: jQuery(this).html()
        }
    });
});

尽管你已经使用Dennis的答案解决了这个问题,但这是我想出的,使用each() ,这可能会或可能不会帮助你得到你想要的东西:

jQuery('li dl dd.job_icons a[class$=_icon]').each(function() {
    var classToSearch = jQuery(this).attr('class').replace('_icon', '_detail');
    jQuery(this).qtip({
        content: {
            prerender: true,
            text: jQuery(this).closest('dd.job_icons').find('.' + classToSearch).html()
        }
    });
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM