jquery：函数被触发多次

Question

我有下面的函数执行某些div（#block_profile）上的qtip2工具提示问题是它被触发多次。所以如果我点击第四个#block_profile，它会调用这个函数4次。我怎样才能让它只执行已被点击的确切div？

// Create the tooltips only on document load 
$(document).ready(function() { 
    // Make sure to only match links to wikipedia with a rel tag 
    $('div.block_profile[rel]').each(function() { 


     // We make use of the .each() loop to gain access to each element via the "this" keyword... 
     $(this).qtip(
      { 
       content:{ 
        // Set the text to an image HTML string with the correct src URL to the loading image you want to use 
        text:'<img src="/assets/ux/modal/loading.gif" alt="Loading..." />', 
        ajax:{ 
         url:'/profiles/get_info/' + $(this).attr('rel') // Use the rel attribute of each element for the url to load 
        }, 
        title:{ 
         button:false 
        } 
       }, 
       position:{ 
        my:'top left', 
        target: 'mouse', 
        viewport:$(window), // Keep the tooltip on-screen at all times 
        adjust:{ 
         x:10, y:10 
        } 
       }, 
       hide:{ 
        fixed:false // Helps to prevent the tooltip from hiding ocassionally when tracking! 
       }, 
       style:{ 
        classes:'container ui-tooltip ui-tooltip-tip' 
       } 
      }) 
    }) 

     // Make sure it doesn't follow the link when we click it 
     .click(function (event) { 
      event.preventDefault(); 
     }); 
}); 

的HTML：

<div id ="block_profile" class ="block_profile rel="1">div 1</div> 
<div id ="block_profile" class ="block_profile rel="2">div 2</div> 
<div id ="block_profile" class ="block_profile rel="3">div 3</div> 
<div id ="block_profile" class ="block_profile rel="4">div 4</div> 
<div id ="block_profile" class ="block_profile rel="5">div 5</div> 

Answer 1

你应该使用下面的代码：

// Create the tooltips only on document load 
$(document).ready(function() { 
    // Make sure to only match links to wikipedia with a rel tag 
    $('div.block_profile[rel]') 
     .qtip({ 
      ... 
     }) 
     .click(function (event) { 
      event.preventDefault(); 
     }); 
}); 

的each通话是没有必要的。例如，检出this demo。