單擊div時可以顯示標題嗎？

Question

當用戶在div上用鼠標單擊時，我想將title（不是Tooltip）「彈出」。

我不想等待鼠標懸停時顯示標題（但它也需要鼠標懸停）。

<div id="someDiv" title ="Info on both click and hover!"></div> 

在這一點上我不關心它如何做:-)

編輯

確定以回顧什麼我正嘗試做：

當我點擊div時，我需要彈出標題，，但如果我不在點擊上點擊，我喜歡標題的工作方式爲「不」與鼠標懸停在一起。不應該一次顯示2個標題。

這只是我試圖解決這個問題之一。我有標題屬性..但現在呢？這可能是一件很容易的......

$('#someDiv').click(function() { 
    $(this).attr("title"); 
    //And how do I show the title right away? 
}); 

Answer 1

我創建了一個jQuery函數$ .hasTitle（）

這個新功能拍攝父div.title你的元素的並拍攝下span.text作爲標題工作。檢查現場：

http://jsfiddle.net/t7kf6ge8/1/

---

JS：

(function($) { 
    jQuery.fn.extend({ 
     hasTitle: function(){ 
      $(this).on("mouseenter mouseout", function(e){ 
       var title = $(this).closest("div.title"); 
       var text = title.next("span.text").first(); 
       text.fadeToggle().css({ 
        left: e.pageX, 
        top: e.pageY 
       }); 
      }); 
     } 
    }); 
})(jQuery); 



$("#elementOne").hasTitle(); 
$("#elementTwo").hasTitle(); 

---

HTML：

<div class="title"> 
    <div id="elementOne"> 
     elementOne 
    </div> 
</div><span class="text">Title: Info on hover!</span> 

<br/><br/><br/><br/> 

<div class="title"> 
    <ul id="elementTwo"> 
     <li>item 1</li> 
     <li>item 2</li> 
    </ul> 
</div><span class="text">It is a list</span> 

---

CSS：

span.text{ 
    position: absolute; 
    display: none; 
    font-size: 10px; 
    font-family: Comic Sans MS; 
    background-color: #ccc; 
} 

---