Inputfeld - iQuery Blur Effekt funktioniert nicht
am 28.09.2012 - 09:43 Uhr in
Hallo zusammen,
ich möchte auf dieser Website mit Drupal 7.15 [ Drupalcenter.de - deutsches Installationsprofil, vielen Dank dafrür. :) ] dem Kontaktformular (wurde mit Webform erstellt) einen jQuery Effekt hinzufügen.
Der Effekt ist ja altbekannt und soll bewirken, dass beim Klick in das Inputfeld die Value verschwindet und wieder auftaucht, wenn man außerhalb des Feldes klickt.
Allerdings bekomme ich das nicht wirklich ans Laufen. Ich habe auch schon in diversen Foren und anderen Threads gesucht, eine funktionierende Lösung habe ich aber nicht wirklich gefunden.
Was habe ich bisher versucht?
Als erstes habe ich über das Modul jQuery Update installiert. Es läuft jetzt die jQuery Version 1.5.2.
Über das Modul Js Injector habe ich auf der Kontaktformular Node dieses Script aufgerufen:
$(document).ready(function() {
//Kontaktformular
$('#edit-submitted-vorname').focus(function() {
if (this.value == this.defaultValue) {
this.value = '';
}
});
$('#edit-submitted-vorname').blur(function() {
if (this.value == '') {
this.value = this.defaultValue;
}
});
Ich habe das ganze erst mal nur für das Feld Vorname ausprobiert, um zu schauen ob es überhaupt funktioniert. Hehe nicht wirklich. :D
jQuery ist im Head eingebungen und auch das Script von Js Injector wird aufgerufen. Die ID, die im Script angesprochen wird stimmt auch. Allerdings tut sich trozdem nichts.
Auf einer anderen Seite (TYPO3), sowie auf einer statischen HTML-Seite hat das ohne Probleme funktioniert.
Ich denke mal, dass das Script nicht wirklich auf jQuery zugreifen kann. Auf der Seite BMI-Rechner habe ich über den Js Injector ein normales JavaScript aufgerufen. Das klappte ohne Weiteres.
Andere Schreibweisen habe ich auch schon versucht. zum Beispiel:
$(document).ready(function() {
$('#edit-submitted-vorname')
.on('focus', function(){
var $this = $(this);
if($this.val() == 'Vorname *'){
$this.val('');
}
})
.on('blur', function(){
var $this = $(this);
if($this.val() == ''){
$this.val('Vorname *');
}
});
});
Hat vielleicht jemand von euch eine Idee, warum es nicht funktioniert? Ich bin dankbar für jeden Tipp. :)
Viele Grüße
- Anmelden oder Registrieren um Kommentare zu schreiben
Warum es nicht funktioniert
am 28.09.2012 - 09:56 Uhr
Warum es nicht funktioniert kann ich dir leider nicht sagen, aber auf meiner Seite (mit Webform) habe ich ein jQuery Plugin eingesetzt.
Vielleicht hilft dir das ja weiter:
http://fuelyourcoding.com/scripts/infield/
Und so sieht der Effekt aus (kombiniert mit jQuery Tools Tooltip):
http://www.webtransformer.de/kontakt