Nasıl jQuery bir kelimenin bir tanımı için bir masa aramak mı?

4 Cevap php

Bu açıklamak biraz zor, ama ben büyük bir çapraz-konuşmak, SQL tanımları tam bir HTML tablosu var. Örneğin, bir "INSERT deyimleri" hakkında konuşurken, ve bir "benzersiz bir anahtar" söz edilmektedir. Satır diğeri benzersiz anahtarlar bahsediyor.

Ben oluşturmak istiyorum küçük definition bubble uygun satırdan tanımı ile (Eğer INSERT satırda "benzersiz anahtar" üzerine geldiğinizde). JQuery kullanarak planlama, ama ben alternatiflere açığım. Herhangi bir fikir?

UPDATE: Benim kod here

4 Cevap

(Sonra ne konum gerçekten) birkaç jQuery tooltip eklentileri vardır. Şahsen ben jQuery Tooltip kullanarak ve onunla mutluyum oldum. Ben bir araç ipucu olarak bazı oldukça karmaşık içerik koymak için kullandım.

Ben tam olarak sorunun kalanını anlamıyorum. Bu otomatik olarak gerçekleşmesi istiyor musunuz? Tablo sayfada mevcut mı? Sunucu tarafı kodu tanımı kabarcıkları yaratıyor?

Şimdi jQuery Tooltip bu tooltip içeriğini tanımlamak olacak bir geri arama (fonksiyon) sağlayabilmektedir bodyHandler niteliği olduğunu bitin cezasına yüzden. Bu bağlantılar / ipuçları otomatik olsa oluşturulan istiyorsun?

EDIT: de highlight plug-in Şuna bir göz atın. Bunu kullanmak bile size belgede metin bulma ve çevrelerindeki öğeleri sarmak için yöntemler kopyalayabilirsiniz. Gibi bir şey:

$(function() {
  $("table.definitions th").each(function() {
    var term = $(this).text();
    var definition = $(this).nextSibling().text(); // assuming it's in a <td> in the same row
    // find all occurrences of 'term' in relevant text block
    // and wrap in <span class="term" title="definition">...</span>
  });
});

Sonra optinoally bu başlığın dışında daha modern bir araç ipucu yapmak için jQuery Tooltip kullanın.

jQuery bu görev için sadece iyi çalışması gerekir. Bir yere gözden uzak tanımı balonu için değeri depolamak ve dolaştığınızda o kadar pop jQuery kullanmak.

yerine doğrudan HTML ayrıştırma, belki <tr/> tanım bulmak için kullanılabilecek bir kimliği, her verebilir. tersine, metin, kabarcık tetikleyen bir kimliğe sahip bir <span /> kelimeleri sarın üzerinde daha fazla denetime sahip olmak isterseniz.

jt

Aksine jason önerilen @ gibi bir sürede sarma daha, ben veya < abbr> etiketleri seçtiğiniz kelimeleri işaretlemek için.

Her durumda, daha sonra something böyle yapabilirdi.

Ben size araç ipucu kurma bırakacağım.

Javascript

$(document).ready(function() {
    $('acronym').hover(function(){
        var text = $('#definition_'+$(this).attr('title')).text();
        console.log(text);  
        $('#cbfsettinguptooltip').text(text)
        });


});

HTML

<table border="1" cellspacing="0" cellpadding="5">

    <tr>
        <td >Insert</td>
        <td id="definition_insert">The insert statement is better than the <acronym title="select">select</acronym> statement</td>
    </tr>
    <tr>    	
        <td >Select</td>
        <td id="definition_select">No No Select is best, much better than <acronym title="insert">insert</acronym></td>
    </tr>
</table>

<div id="cbfsettinguptooltip">

</div>