Javascript getElementById()

Question

Ich versuche, eine generische JavaScript-Funktion zu erstellen, die Attribute für Ereignisse ändern würde.

So wie es funktionieren würde, ist

function fooFunction(sourceElement) 
{  
    var newName = sourceElement+'Span';  
    var newElement = document.getElementById(newName); 
    //Important line 
    newElement.property = "enter properties here"; 
} 

und ich es mit etwas nennen würde wie

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction(this.id);"/> 
<span id="fooSpan" name="fooSpan">some text here</span> 

Also in der Theorie, wenn das Bild schwebt, sollte es was propery ändern Ich muss Ändern Sie das fooSpan-Objekt. Es funktioniert in Opera, aber auf IE gibt es ein Null-Objekt zurück.

Irgendwelche Ideen?

Die Idee wäre, dass ich mehrere Bilder haben würde, die automatisch die Änderung der Eigenschaft auf die zugehörige Textspanne auslösen würde (in der Regel der CSS-Stil).

Answer 1

Sind Sie sicher, dass Sie die ID in IE richtig erhalten? Vielleicht ist die übergebene ID in IE null (vielleicht funktioniert diese.id nicht?).

Try es so nennen:

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction('foo');"/> 

und sehen, ob das hilft. Ich sehe keinen Grund, warum getElementById() scheitern würde, so dass ich nur daran denken kann, dass es sich um ein ID-Problem handelt.

Answer 2

Möglicherweise funktioniert diese Zeile in IE nicht. "newElement.property" Ich kenne den genauen Grund nicht.

können Sie diese anstelle der Zeile verwenden

newElement.setAttribute (Eigenschaft „Eigenschaften geben Sie hier“);

In der Zwischenzeit versuche ich, den Grund für den Fehler herauszufinden.

Answer 3

Mein Vorschlag würde so etwas tun.

function fooFunction(sourceElement,property,propertyValue) {  
    var newElement = document.getElementById(sourceElement); 
    newElement.setAttribute(property,propertyValue); 
}; 

Und Ihre HTML würde wie folgt aussehen:

<img src="foo.gif" id="foo" name="foo" 
      onmouseover="fooFunction('fooSpan','class','mouseover_span');"/> 
<span id="fooSpan" name="fooSpan">some text here</span> 

Answer 4

ich STARK würde Sie bitten, mit jQuery eingebauten in attr() -Methode zu berücksichtigen, die die Funktion, die Sie in allen Browsern wollen perfekt integriert und unglaublich ist Einfach zu verwenden.

Ihrem Beispiel verwenden, wenn Sie das „src“ Eigenschaft für „foo“ ändern wollten, können Sie es in einer einzigen Codezeile tun könnte:

$("#foo").attr("src","images/whatever.png"); 

Und falls Sie wollten die html ändern WITHIN „fooSpan“ alles, was Sie zu tun haben würde, ist:

$("#fooSpan").html("something else"); 

Sie können sogar diese Ereignisse binden, dass Sie gehen zu geben, viel mehr Flexibilität als die onmouseover Eigenschaft:

$(document).ready(function(){ 
$("#foo").mouseover(function(){ 
    $("#fooSpan").html("something else"); 
    $("#foo").attr("src","images/whatever.png"); 
    }); 
});