Radiobutton in Tooltip

iLu_is_a_loser

Erfahrenes Mitglied
Radiobutton im Tooltip funktioniert nicht

Guten Tag

ich bin gerade dabei eine Übersicht zu programmieren. Dazu habe ich ein Tooltip gemacht. Wenn ich dort nun Radiobuttons einblende, kann ich nur einmal eins auswählen und dannach geht garnichts mehr.
Kann mir jemand behilflich sein?

Hier ist die Ausgabe:

HTML:
<div id="ausgabe_bemerkung">
 <tool class="keyword">
  <aspan id="tooltip" style="display: none;">
   <b>EP</b>
   <br>
   <br>
   <input type="radio" id="radiobutton" value="0" name="fortschritt"> offen<br>
   <input type="radio" id="radiobutton" value="1" name="fortschritt"> programmiert<br>   <input type="radio" id="radiobutton" value="2" name="fortschritt"> fertig<br>
  </aspan>
  <em>EP</em>
 </tool>
</div>

sobald man über <em>EP</em> fährt, wird der Tooltip <aspan> eingeblendet.

PHP:
	jQuery(document).ready(function(){
		$(".keyword #tooltip").hide(); 
		$('.keyword').hover(
			function(e){              
				if ($(this).html()){	           
					var mywidth = $(this).width();
					var myheight = $(this).height();
					var position = $(this).position();                
					$(this).addClass('hoverDiv').append('<div class="tooltip"><div class="innerTip">'+$(this).children("aspan").html()+'</div><div class="arrowDown" style="display:none"></div></div>');
					$(".tooltip").css({buttom: position.buttom,left: position.left});
					$(".tooltip").show().css({opacity:0});
					$(".tooltip").animate({opacity:.9,buttom: position.buttom-$(".tooltip").height()},400,function(){
						$(".arrowDown").slideDown();            
					});
				}
			}, 
			function() {
				$(this).removeClass('hoverDiv');
						$('.tooltip').children().remove();
						$('.tooltip').remove();	
			}
		);    
	});

Der HTML Code oben wird mittels PHP in einer Schleife ausgegeben.

Füge ich den HTML Code oben in eine neue HTML Datei ein, kann ich zwischen den Radiobuttons hin und her klicken. Momentan kann ich aber nur einmal klicken und das wars.
Hat jemand vielleicht eine Idee?

gruß
 
Zuletzt bearbeitet:
Füge ich den HTML Code oben in eine neue HTML Datei ein, kann ich zwischen den Radiobuttons hin und her klicken. Momentan kann ich aber nur einmal klicken und das wars.
Hat jemand vielleicht eine Idee?

Soll das heißen, dass der hier gepostete Code das Problem gar nicht zeigt (habe ihn getestet und er funktioniert), aber das es auf der konkreten Seite nicht geht? Falls das so ist, dann hilft uns der Code nicht weiter, da bräuchte man den tatsächlichen, fehlerhaften Code.
 
Ich denke es hängt irgendwie mit dem jQuery Code zusammen.

Wenn ich den name-Tag vom Button rausnehme, kann ich alle makieren. Sobald ich aber dieses namen-Tag rein nehme kann ich nur einmal anwählen und das wars dann :(
 
Problem gefunden.
Ich lasse die Radiobuttons in einem Element anzeigen, welches ich bei Mouseover anzeigen lasse. Das ganze befindet sich wiederrum in einem Element welches bei einem Mausklick getoggelt wird.

Dadurch ensteht wohl ein Fehler, wenn man das Inputfeld anklicken möchte.
 
Ich hab ein Problem. Ich denke ich hänge es einfach hier ran, da es zur Grundproblematik gehört von diesem Thema.
Den Code habe ich ein wenig überarbeitet.

PHP:
			canToggle = true;

			// Tooltip
			function showToolTip(){  
				var canToggle = false;	
				var mywidth = $(this).width();
				var myheight = $(this).height();
				var position = $(this).position(); 
				$(this).find(".tooltip").css({
					bottom: position.bottom,left: position.left
				});
				$(this).find(".tooltip").show().css({
					opacity:0
				});
				$(this).find(".tooltip").animate({
					opacity:.9,
					bottom: position.bottom-$(".tooltip").height()
				},400);			
			}
			function hideToolTip() {
				var canToggle = true;				
				$(this).find('.tooltip').hide();	
			}
			$(".keyword").hoverIntent({
				sensitivity: 1, 
				interval: 100,   	
				over: showToolTip,   
				timeout: 100,   		
				out: hideToolTip      
			});			
                        // Toggle
			$(".auflistung").click(function() {
				if(canToggle == true) {
					$(this).find("#ausgabe_box").toggle();
				}
			});

So ich habe folgendes vor. Sollte das Tooltip-Fenster offen sein, soll es nicht möglich sein die #ausgabe_box zu toggeln. Ich habe es mit einer Variable dessen Wert ich bei dem Tooltip übergebe versucht. Nur irgendwie bringt es rein garnichts.

Hat jemand eine Idee?


gruß
 
Zuletzt bearbeitet:
Lass innerhalb von showToolTip und hideToolTip das Schlüsselwort "var" vor der Variable weg. Dadurch deklarierst du innerhalb dieser Funktionen eine neue Variable, anstatt die äußere zu verwenden.
Im Gegenzug solltest du vor die äußere Variable ein "var" setzen, denn sonst ist sie global.
 
Danke das funktioniert ja wunderbar.
Im Firefox läuft das alles spitze. Im IE kann ich den ToolTip aber nur 1x anzeigen lassen. Wenn ich diesen dann erneut einblenden möchte passiert garnichts.
 
Zurück