✔ Eigenschaften eines javaScript Objekt über jQuery ansprechen

B

BlubBlub

Mitglied
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
	<head>
		<title>Test</title>
		<script type = 'text/javascript' src="../jquery-1.5.1.min.js"></script>
	
	<script type="text/javascript">		
		$(document).ready(function(){	
			alert('document completely loaded');
		});
		
		function startDomManipulation()
		{
			var newEntry = new Option('displayedText1', 'sendedElementValue1', false, false);
			document.getElementById("notebookField").options[document.getElementById("notebookField").length] = newEntry;
			
			newEntry = new Option('displayedText2', 'sendedElementValue2', false, false);
			document.getElementById("notebookField").options[document.getElementById("notebookField").length] = newEntry;
			
			document.getElementById("notebookField").options[1].selected = true;	
		}
		
		function startDomManipulation2()
		{
			var newEntry = new Option('displayedText1', 'sendedElementValue1', false, false);
			$("notebookField").options[$("notebookField").length] = newEntry;
			
			newEntry = new Option('displayedText2', 'sendedElementValue2', false, false);
			$("notebookField").options[$("notebookField").length] = newEntry;
			
			$("notebookField").options[1].selected = true;	
		}
		</script>
	</head>
	
	<body>
		text
		<form name="formular" action="" method="post" enctype="" target="">
			<div>
				<select id="notebookField" name="notebookField" size="1"></select>
			</div>
		</form>
		
		<input type="button" value="startDomManipulation()" onclick="startDomManipulation()">
		<input type="button" value="startDomManipulation2()" onclick="startDomManipulation2()">
	</body>
</html>

Hi ich wollte die nativen Zugriffe umschreiben, so dass ich mich nur der jQuery Methoden bediene.
Die Funktion eins zeigt die nativen Zugriffe.
Die Funktion zwei sollte dazu dienen selbiges wie Funktion eins zu erfüllen, jedoch mit jQuery Aufrufen.
Das was ich in der Funktion zwei geschrieben habe kann natürlich nicht funktionieren, es soll lediglich veranschaulichen was ich vorhabe.
Wie schaffe ich es mittels der jQuery Aufrufe auf das Option Objekt des mit jQuery selektierten Elements zuzugreifen und dann auch auf die Eigenschaften des Option Objekts zuzugreifen?

Hier noch ein kurzer Überblick über das Option Objekt http://de.selfhtml.org/javascript/objekte/options.htm#selected
 
Ich würde es vermutlich so machen

Javascript: 
function startDomManipulation2()
{
	var field = $("#notebookField");
	field.append('<option value="sendedElementValue1">displayedText1</option><option value="sendedElementValue2">displayedText2</option>');
}

Oder auch so

Javascript: 
function startDomManipulation2()
{
	var field = $("#notebookField");
	field.append(new Option('displayedText1', 'sendedElementValue1', false, false));
	field.append(new Option('displayedText2', 'sendedElementValue2', false, false));
}
 
jau cool folgendes funktioniert prima

Code: 
var newEntry = new Option('displayedText1', 'sendedElementValue1', false, false);
$("#notebookField").append(newEntry);
newEntry = new Option('displayedText2', 'sendedElementValue2', false, false);
$("#notebookField").append(newEntry);
			
$("#notebookField option:last").attr({selected:true});

thx
 
Gewöhne dir aber bitte an, Referenzen zu speichern. In deinem Beispiel schickst du jQuery drei mal auf die Suche nach "#notebookField".
So wäre es besser:

Javascript: 
var notebookField = $("#notebookField");
var newEntry = new Option('displayedText1', 'sendedElementValue1', false, false);
notebookField.append(newEntry);
newEntry = new Option('displayedText2', 'sendedElementValue2', false, false);
notebookField.append(newEntry);

$("option:last", notebookField).attr({selected:true});
 
Au ja das ist ein guter Hinweis, werd ich beachten.

Ich hab den Code grad auch noch im IE 8 ausprobiert, dort funktioniert er nicht. Während er im Firefox, Opera und Chrome läuft, fügt er im IE 8 nur leere Positionen ein. Woran liegt das? An dem Option Objekt kann das ja eigentlich nicht liegen da die nativer Version ja funktioniert, also müsste das am append Aufruf liegen, aber der sieht doch in Ordnung aus.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück