Javascript / Jquery：如果找到rel，則附加數據，否則，不附加數據

Question

http://jsfiddle.net/zD99p/

我有以前的jsfiddle。 現在，如果你將鼠標懸停在“測試”上，你會看到一個方塊。 你會注意到在html中， <a> for testing沒有rel。 如果沒有rel，我會添加什么來阻止附加到文本上，但如果找到rel仍然會附加？

碼：

this.screenshotPreview = function(){            
        xOffset = 20;
        yOffset = 30;

    $("tr").hover(function(e){
         var text = $(this).find('a').attr('rel');   
        $("body").append("<p id='screenshot'>"+ text +"</p>");                                 
        $("#screenshot")
            .css("top",(e.pageY - yOffset) + "px")
            .css("left",(e.pageX + xOffset) + "px")
            .fadeIn("fast");                        
    },
    function(){
        this.title = this.t;    
        $("#screenshot").remove();
    });    
    $("a.screenshot").mousemove(function(e){
        $("#screenshot")
            .css("top",(e.pageY - yOffset) + "px")
            .css("left",(e.pageX + xOffset) + "px");
    });            
};

// starting the script on page load
$(document).ready(function(){
    screenshotPreview();
});

HTML：

<table>
    <tr><td>content<a rel="Testing this out.  This could be a long description. Blah blah blah. Testing this out.  Testing this out.  This could be a long description. Blah blah blah. Testing this out.  " ></td></tr>
        <tr><td><a>Testing</a></td></tr>
    <table>

Answer 1

將選擇器更改為僅具有rel屬性的目標元素

$("tr:has(a[rel])").hover(function(e){ ...

小提琴

Answer 2

嘗試這個tr懸停：

$("tr").hover(function(e){
    var text = $(this).find('a').attr('rel');
    if ($.trim(text) === '') return;//exit if no text for append   
    $("body").append("<p id='screenshot'>"+ text +"</p>");                                 
    $("#screenshot")
        .css("top",(e.pageY - yOffset) + "px")
        .css("left",(e.pageX + xOffset) + "px")
        .fadeIn("fast");                        
},
function(){
    if (!this.t) return;
    this.title = this.t;    
    $("#screenshot").remove();
});