2013-12-10 25 views
0

对不起,jQuery完全不熟悉。我想知道如何获得title属性并将其附加到href标记的内部html中。我无法修改html源代码,但我必须能够将标题文本附加到href标记内的文本末尾。感谢帮助社区。jQuery如何显示标题属性并附加到内部html

<script style="text/javascript"> 
    $(document).ready(function() 
    { 
     $("#part4 > a").mouseover(function() {   
      $(this).next().html(("#part4 > a").attr("title")).toggle(); 
     }); 

     $("#part4 > a").mouseout(function() { 
      $(this).next().html(("#part4 > a").attr("title")).toggle(); 
     }); 
    }); 
</script> 
<div id="part4"> 
    <h2>4: Link and Title Attribute Demo</h2> 

    <a href="#" id="linkTitle" title="This is text from the title attribute, wrapped in a span tag, placed here by jquery."> 
    Hover over this text</a> 
</div> 

回答

1
var text = $('#linkTitle').html(); 
$("#part4 > a").mouseover(function() {      
     $(this).html(text + $(this).attr('title')); 
}); 
    $("#part4 > a").mouseout(function() { 
     $(this).html(text); 
}); 
1
$(this).html($("#selector").attr("title")); 

OR

$(this).append($("#selector").attr("title")); 

尝试以上。

3

试试这个

$(document).ready(function() 
{ 
    var text = $('#linkTitle').text(); 
    $("#part4 > a").mouseover(function() {      
    $(this).html(text + $(this).attr('title')); 
    }); 
    $("#part4 > a").mouseout(function() { 
    $(this).empty().append(text); 
    }); 
}); 

DEMO

1

试试这个

$(document).ready(function() { 
     $("#part4 > a").mouseover(function() {   
      var title = $(this).attr("title"); 
      var html = $(this).html(); 
      $(this).html(title); 
      $(this).attr("title",html); 
     }).mouseout(function() {   
      var title = $(this).attr("title"); 
      var html = $(this).html(); 
      $(this).html(title); 
      $(this).attr("title",html); 
     });    
    }); 

Live Demo

$(document).ready(function() { 
     function hovertoggle(dis) { 
      var title = dis.attr("title"); 
      var html = dis.html(); 
      dis.html(title); 
      dis.attr("title",html); 
     } 

     $("#part4 > a").mouseover(function() {   
      hovertoggle($(this)) ; 
     }).mouseout(function() { 
      hovertoggle($(this)); 
     });    
    }); 

Live Demo

1

http://jsfiddle.net/x6Xe3/

$(document).ready(function() 
    { 
     var linkTxt = '' 
     $("#part4 > a").hover(function() {  
      linkTxt = $(this).text(); 
      $(this).append($(this).attr("title")); 
     },function() { 
      $(this).text(linkTxt); 
     }); 
    }); 

检查这个例子。

1
<script style="text/javascript"> 
    $(document).ready(function() 
    { 
     default_text = $('#part4 > a').text(); 
     $('#part4 > a').hover(   
      function(){ 
        $(this).html($(this).attr('title')); 
      }, 
      function(){ 
        $(this).html(default_text); 
      } 
     ) 
    }); 
</script> 
相关问题