2012-10-26 7 views
16

Ben kullanıcıya bazı dinamik mesajları görüntülemek için jQueryUI ipucunu kullanıyorum görünmesini yerine üzerine gelindikten tıklayın. Temel olarak, kullanıcı bir düğmeyi tıkladığında araç çubuğunu bir giriş alanının üstüne görüntülemek istiyorum.jQueryUI araç ipucu başka yerde

Ben düğmesinin üstünde gezinip yalnızca çalışır ve jQueryUI örneklerde bu senaryoyu ulaşmaya hiçbir yardım yoktur kodlu çıkma yöntemi. Vurgulu etkisinden nasıl farklı olur ve düğmenin tıklama olayıyla çalışmasını nasıl sağlayabilirim? Bunu nasıl başarabilirim?

Bunun için jquery-ui-1.9.0.custom.js ve jquery-1.8.2.js kullanıyorum.

HTML Kodu: Ben Tooltip

<input id="myBtn" type="submit" name="myBtn" value="myBtn" title="this is not used" class="myBtn" /> 

JQuery kod açılır için de sipariş tıklayın Bu giriş kutusuna

<input id="myInput" type="text" name="myInput" value="0" size="7" /> 

düğmesi üstündeki mesajı görüntülemek istediğiniz

$(document).ready(function() { 
    $(".myBtn").tooltip({ 
       content: function() { 
        return '<span id="msg">Message</span>'; 
       }, 
       position: { 
        my: "center bottom", 
        at: "center top" 
       } 
      }); 
}); 

cevap

18

kolay yolu myBtn başlık niteliği kaldırmak ve başka bir öğe üzerine ipucunu taşımaktır. Örneğin:

<a id="myTooltip" title="Message"></a> 

Sonra yapabilirsiniz:

$('#myTooltip').tooltip({ 
    //use 'of' to link the tooltip to your specified input 
    position: { of: '#myInput', my: 'left center', at: 'left center' } 
}); 

$('#myBtn').click(function() { 
    $('#myTooltip').tooltip('open'); 
}); 

Benzer otomatik açtıktan sonra araç ipucu kapatmak için

$('#myTooltip').tooltip('close'); 

ile araç ipucu kapatabilir sadece gereken open olayı içinde close yöntemini çağırın:

$('#myTooltip').tooltip({ 
    open: function (e) { 
     setTimeout(function() { 
      $(e.target).tooltip('close'); 
     }, 1000); 
    } 
}); 
( open olayı içinde çalışmaz this gibi) e.target kullanılması

ve setTimeout() ipucu kapanacak olan sonraki bir zaman sınırı ayarlamak için kullanılır.

+1

Kapat olayını başka bir kullanıcı davranışının içine ekledim ve işe yarıyor. Yardım için Thx @Elliott – Swarne27

+0

Eğer programatik açıldıktan sonra otomatik olarak araç ipucunu kapatmak istersem? – Swarne27

+0

Lütfen benim düzenle – Elliott