2012-12-17 38 views
0

我在日曆中有一些tootlip的代碼。我希望能夠在工具提示中顯示html,這可能嗎?每次我嘗試和改變它接受HTML崩潰只允許文字現在,我不知道如何去改變它允許HTML函數this.text = text;到html

 <!DOCTYPE html> 
     <html> 
     <head> 
      <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
      <title></title> 

      <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script> 

      <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
      <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 


       <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
       <script type='text/javascript' src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 


      <style type='text/css'> 
      .pink > a { 
      background-color: pink !important; 
      background-image:none !important; 
     } 

     .green > a { 
      background-color: green !important; 
      background-image: none !important; 
     } 

      </style> 



     <script type='text/javascript'>//<![CDATA[ 
     $(window).load(function(){ 
     var Event = function(text, className) { 
      // would like to convert this to allow for html 
      this.text = text; 
      // this.html = text; // does not work 
      this.className = className; 
     }; 

     var events = {}; 
     events[new Date("01/01/2013")] = new Event("New Years Day", "pink"); 
     events[new Date("12/25/2012")] = new Event("<B>Merry</b> Christmas", "green"); 

     console.dir(events); 

     $("#dates").datepicker({ 
      beforeShowDay: function(date) { 
       var event = events[date]; 
       if (event) { 
        return [true, event.className, event.text]; 
       } 
       else { 
        return [true, '', '']; 
       } 
      } 
     }); 
     });//]]> 

     </script> 


     </head> 
     <body> 
      <div id="dates"></div> 


     </body> 


     </html> 

預先感謝您的任何代碼或幫助你可以提供時間

Johnny

+2

你到底在問什麼? – jackcogdill

+0

如何更改工具提示以顯示HTML,所以它使快活的大膽在快樂聖誕節字符串 – Johnny

+0

不會讓我粘貼代碼的評論或我不知道如何至少。第一次我使用stackoverflow.com – Johnny

回答

0

title屬性不允許html代碼。

但有幾個框架允許你修改懸停。

我用jQuery Tooltip

<script src="http://jquery.bassistance.de/tooltip/jquery.tooltip.js"></script> 
$('*').tooltip(); 

在這裏你會看到他們說明文字也被修改,並大膽到位。

http://jsfiddle.net/Morlock0821/WqrMK/

+0

這就是我正在尋找的,這個例子是完美的,im感謝別人指出它需要一個插件謝謝你,我選擇了這個解決方案,因爲它有一個例子如何再次解決問題,謝謝大家的意見和建議 – Johnny