生成提示文本/外部文件

我創建了一個簡單的jQuery toolip：http://jsfiddle.net/oampz/k9THH/生成提示文本/外部文件

我的問題是，我不希望放置img標籤內的文本，因爲我有20多個工具提示頁面上在每個..很多文本有什麼辦法我可以讓工具提示訪問一個.js文件（或任何其他文件），並從中捕獲必要的文本？

HTML：

<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 1" height="20px" /> 
<br> 
<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 2" height="20px" /> 
<br> 
<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 3" height="20px" /> 
<br> 
<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 4" height="20px" /> 
<br> 
<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 5" height="20px" /> 
<br> 
<img class="tooltip" src="http://www.katherineemmons.com/wp-content/uploads/2013/06/question_mark-icon.png" title="tool tip text 6" height="20px" />

的jQuery：

$(function() { 
    $(".tooltip").tooltip({ 
     show: { 
      effect: "slideDown", 
      delay: 250 
     } 
    }); 
});

感謝

來源

2014-03-24 Oam Psy

可以有很多技術，但事實是，你必須編寫文本 –

你想把這個txt文件放在服務器上並讀取它嗎？ – anshuVersatile

@dholakiyaankit ..我很高興寫文本，我想要做的不是用我的.HTML文件填充這些文本，而是從某處讀取它們。 –

$(document).tooltip({ 
    show: { 
     effect: "slideDown", 
     delay: 250 
    }, 
    content: function() { 
     var element = $(this); 
     if (element.is(".the_class")) { 
      return "The text here"; 
     }   
    }, 

});

來源

2014-03-24 13:25:59 MichelRobico

這不起作用。 –

你離開了title =「」？ – MichelRobico

是的，提供一個jsFiddle –

<html> 
<head></head> 
<link rel="stylesheet" href="css/smoothness/jquery-ui-1.10.4.custom.css"> 
<script src="js/jquery-1.10.2.js"></script> 
<script src="js/jquery-ui-1.10.4.custom.js"></script> 
<body> 
    <img src="http://yoursite.com/img/" data-tooltip-id="1" /> 
    <br> 
    <img src="http://yoursite.com/img/" data-tooltip-id="2" /> 
    <br> 
    <script> 
     $(function(){ 
      var tooltip_blob = ''; 
      $(document).tooltip({ 
       items : "[data-tooltip-id]", 
       content: function() { 
        var tooltip_id = $(this).data('tooltip-id'); 
        jQuery.ajax({ 
         async:false, 
         dataType: 'json', 
         type : 'get', 
         url : 'http://yoursite.com/ajax.php?tooltip_id='+tooltip_id, 
         success : function(data){ 
          tooltip_blob = data.tooltip; 
         }});  
        return tooltip_blob; 
       } 
      }); 
     }); 
    </script> 
</body> 
</html>

AJAX文件：

<?php echo json_encode(array('tooltip' => $_GET['tooltip_id'])); ?>

來源

2014-03-24 14:03:31

@Oam Psy：嗨，您要求從外部文件加載工具提示內容？看我的例子... –

生成提示文本/外部文件

回答

相關問題