✔ Eventhandler für angehängte Objekte

[D34DL1NES]

Hi,
ich möchte gerne an ein Objekt das ich Appende einen Eventhandler(blur) anhängen, bzw. ich habe ihn dafür geschrieben aber er wird nicht aufgerufen, grundsätzlich funktioniert er aber.

Wie kann ich Jquery in onblur="" nutzen?
Kann ich irgendwie anders den Eventhandler für das Objekt setzen?

mfg

deadr

 

[kuddeldaddeldu]

Hi,

binde den Handler per live() an das Event.

LG

 

[D34DL1NES]

Danke ;D

Leider doch nicht die Lösung:

Zitat: Currently not supported: blur, focus, mouseenter, mouseleave, change, submit

Hat jemand vielleicht doch eine Idee für einen Workaround?

Gruß

deadr

 

[kuddeldaddeldu]

Hi,

dann binde den Handler halt direkt an, wenn Du das Element einhängst. Wie hast Du es denn bis jetzt versucht?

LG

 

[D34DL1NES]

Ja aber irgendwie sagt er das es die funktion nicht geben würde. und wenn ich die funktion komplett einbinde tut er iwie auch nichts( ich glaube das macht probleme mit jquery... wär cool wenn du ein kleines beispiel schreibst wie ich eine jquery funktion in onblur="" einbinden kann. onblur="funktionsname();" habe ich schon versucht^^ da sagt er nicht definiert.

 

[kuddeldaddeldu]

Hi,

wär cool wenn du ein kleines beispiel schreibst wie ich eine jquery funktion in onblur="" einbinden kann.

Wäre cooler, wenn Du mal zeigen würdest, wie Du das Objekt einhängst und wie Du dann versuchst, den blur-Handler zu definieren. Wie soll man sonst wissen, was genau Du da tust und wo's hakt?

Und achte in Deinen Beiträgen bitte auf unsere Netiquette, besonders Punkt 15. Danke.

LG

 

[Sven Mintel]

Moin,

es ist immer wichtig, zwischen JQuery-Objekten und DOM-Elementen zu Unterscheiden, das sind halt 2 verschiedene Paar Schuhe.

<input id="selector">
<script type="text/javascript">
//JQuery-Objekt
$('#selector').blur(function(){alert('JQuery:onblur')});
//DOM
document.getElementById('selector').onblur=function(){alert('DOM:onblur')};
</script>

http://docs.jquery.com/Events/blur#fn

 

[D34DL1NES]

Also:

Ich habe ein <input> type=text.
wenn das geklickt wird wird es removed und ein input type=password angehängt.
Wenn das wiederum blured und keinen content hat soll es selbst removed werden und wieder ein input mit type=text und value="password" appenden.

Das ist das Ziel. Ich bekäme das zwar auch so hin ohne das ganze DOM manipulating, aber dann macht der IE8(warscheinlich auch 6/7) Zicken, der behandelt type nämlich noch nach DOM 1 als readonly(anscheinend).

zu Sven:

Als $ funktioniert es genauso wenig wie als DOM. Die Funktion an sich f*u*n*zt(warum wird "f u n z" gelöscht?) aber.



Der Code:

 var LoginForm = $("#LoginForm"),
        LoginName = $("#LoginName"),
        LoginPasswordState = false,
        LoginDropDownButton = $("#LoginDropDownButton"),
        LoginArea = $("#LoginArea"),
        LoginActiveState = false;
        
        
        $("#LoginPassword").click(function()
        {
            if(LoginPasswordState==false)
            {
                $("#LoginPassword").remove();
                LoginForm.append("<input id='LoginPassword' name='LoginPassword' type='password' class='LoginInput' />");
                document.LoginForm.LoginPassword.focus();
                LoginPasswordState = true;
            }
        });
        

        // Wahlweise $("#LoginPassword").blur(function(){});
        document.getElementById('LoginPassword').onblur=function()
        {
            alert("blur");
            if($("#LoginPassword").attr("type")=="password")
            {
                alert("blur-type pw");
                
                if (LoginPasswordState == true)
                {
                    alert("blur - state true");
                    
                    if($("#LoginPassword").attr("value")=='')
                    {
                        alert("blur-value=''");
                        
                        $("#LoginPassword").remove();
                        LoginForm.append("<input id='LoginPassword' name='LoginPassword' type='text' class='LoginInput' value='password' />");
                        LoginPasswordState = false;
                    }
                }
            }
        };

 

[Sven Mintel]

Also das Problem ist halt, das die Eventüberwachung diesem spezielle Element zugewiesen wird, also dem, welches im Moment der Zuweisung die ID besitzt.

Wenn du später das Element durch ein anderes ersetzt, ist die Eventüberwachung futsch, dass das neue Element die selbe ID hat, spielt keine Rolle.
Du musst die Eventüberwachung jedes mal neu vornehmen.

Der einfachste Weg wäre wohl, wenn du die Funktion global verfügbar machst und die Eventüberwachung bei append() mit notierst.

 

[D34DL1NES]

Der einfachste Weg wäre wohl, wenn du die Funktion global verfügbar machst und die Eventüberwachung bei append() mit notierst.

Das Check ich nicht. Kannst du mir das mal beispielhaft demonstrieren?


Edit: Achsoo

Du meinst

function blur(){}

append(<input onblur="blur();"/>)

korrekt?

Das funktioniert bei mir leider nicht:

passwordBlur is not defined
function onblur(event) { passwordBlur(); }(blur )
daran hatte ich nämlich auch schon gedacht :-/