Verwandte Themen

abbrechen
06.09.2016, 23:26
Beitrag wurde 1 Mal erneut eingestellt
json Daten in JavaScript auslesen und an html Elemente weiterleiten?

Hi,

mehr schlecht als recht arbeite ich mich gerade durch json und habe tatsächlich mittlerweile herausfunden, dass man zum Laden einer json-Datei ohne jQuery folgenden Ansatz zu brauchen scheint: 

function loadJSON(callback) {var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', 'data.json', true); // Replace 'my_data' with the path to your file
xobj.onreadystatechange = function () {
      if (xobj.readyState == 4 && xobj.status == "200") {
        // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
        callback(xobj.responseText);
      }
};
xobj.send(null);  
}

Wie ich damit dann allerdings Objekte und values auslese und weiterleite, ist mir schleierhaft.

Hier ist erst einmal der json Code

{"employees":
    [
        {
            "firstName": "John", 
            "lastName": "Doe"
        },
        {
            "firstName":"Anna", 
            "lastName":"Smith"
        },
        {
            "firstName":"Peter", 
            "lastName":"Jones"
        }
    ]
}

Meine Idee war ja etwas wie document.getElementbyID oder halt byClassName, um den Content im DOM zu verteilen. Aber irgendwas scheint mir zu fehlen.

Pseudocode mäßig wäre halt sowas schön: getElementbyID('title').data(firstName[0]) Irgendwie so halt ...

Was ich bisher gefunden habe, waren nur Kurzeinleitungen, wie ich den Code in der Konsole ausspucke, js Arrays erstelle (warum auch immer die Leute das in einem json Tutorial als Lösung anbieten) oder html Elemente in JavaScript mit dem json Inhalt erstelle. Wie gesagt, würde ich jedoch gerne den json Inhalt an meine bereits existierenden html Elemente weitergeben.

ps. Wenn ihr dazu eine jade-Lösung habt, wäre das natürlich noch um so prickelnder.

HTML, programmieren, JavaScript, AJAX, PHP, JSON
2 Antworten
LittleDustBunny
16.08.2016, 21:46
Dropdown Menü springt andauernd auf die erste Auswahl zurück - wie kann ich das verhindern?

Ich habe schon an mehreren Stellen nach einer Antwort gesucht, aber keiner konnte mir weiter helfen. Und zwar geht es um eine Software, die ich auf meinem Webspace verwende. Dort gibt es ein paar Dropdown Menüs mit Auswahlmöglichkeiten (Bearbeitungsbereich von einem Userprofil). Soweit, so gut. Wenn ich jetzt aber einen Punkt auswähle und auf "speichern" klicke, springt die Auswahl in dem Dropdown Menü zurück auf den ersten Punkt, sodass ich ihn auf die nächste Bearbeitung erneut auswählen muß. Das will ich aber nicht, denn auf Dauer wird das richtig nervtötend. Ich möchte, dass die zuletzt gesetzte Auswahl abgespeichert wird, sodass ich das bei der Bearbeitung nicht ständig vom neuen setzen muß.

Aber wo kann ich in der Programmierung den Befehl dafür setzen?

Bisher habe ich nur mit CSS Dropdown Menüs gearbeitet, aber soweit ich heraus gefunden habe, läuft dieses hier über JavaScript (hatte noch nie damit zu tun, ist - zumindest im Bereich Dropdown Menü - totales Neuland für mich). Dazu habe ich eine (die einzige) Datei gefunden, wo es einen Befehl dafür gibt, nur leider werde ich nicht so ganz schlau daraus. Vielleicht hat mir ja einer einen Rat dazu? Hier der Ausschnitt:

function(a){var c="dropdown",f="4.0.0",g="bs.dropdown",h="."+g,i=".data-api",j=a.fn[c],k={HIDE:"hide"+h,HIDDEN:"hidden"+h,SHOW:"show"+h,SHOWN:"shown"+h,CLICK:"click"+h,CLICK_DATA_API:"click"+h+i,KEYDOWN_DATA_API:"keydown"+h+i},l={BACKDROP:"dropdown-backdrop",DISABLED:"disabled",OPEN:"open"},m={BACKDROP:".dropdown-backdrop",DATA_TOGGLE:'[data-toggle="dropdown"]',FORM_CHILD:".dropdown form",

Ich bin für jede Hilfe dankbar! Denn so langsam verzweifle ich daran.

HTML, programmieren, Java, JavaScript
2 Antworten
Weroni1
26.06.2016, 21:54
jQuery: An- und Ausschalter programmieren mit einer Variablen Programmieren?

Ich muss folgende Aufgabe lösen:

"Beim Überfahren des großen Bildes wird die Grafik „bild1.jpg“ gegen die Grafik „bild2.jpg“ ausgetauscht – beim Verlassen des Bildes wird die ursprüngliche Grafik wieder angezeigt.

Dieses Austauschen funktioniert aber nur, wenn zuvor der Ausschalter mit einem Klick „angeschaltet“ wurde – Grafiktausch mit Datei „schalterein.png“. Wird der Schalter wieder ausgeschaltet, dann geht auch die Mouseover-Funktionalität nicht mehr. Wichtig: Arbeiten Sie mit einer Variablen namens schalter."

Bei dem Schalter handelt es sich um ein Image und keinen Button.

Der erste Teil der Aufgabe - der Grafiktausch beim Hovern - ist kein Problem.

Den Schalter bekomme ich aber nicht programmiert. In anderen Aufgaben haben wir immer einen separaten An- und Ausschalter programmiert, bisher nicht beides zusammen und ich komme einfach nicht auf eine Lösung.

Bisher habe ich nur den Anschalter programmiert (kann natürlich falsch sein):

var Schalter=0;

$("img:eq(2)").click(function (){ Schalter=1; $("img:eq(2)").attr("src","schalterein.png"); })

Wenn man wieder auf das Schalter img klickt soll der Schalter=0 werden, das Bild soll sich wieder ändern & somit wäre er ausgeschaltet.

Ob der Schalter auf 0 oder 1 steht dient zur Abfrage um den Hover Effekt/ Grafiktausch zu aktivieren bzw. deaktivieren.

Kann auch sein, dass mein Ansatz total falsch ist. Ich hoffe jemand kann mir hier weiterhelfen.

HTML, programmieren, CSS, JavaScript, JQuery
5 Antworten

Meistgelesene Beiträge zum Thema JavaScript

Mehr meistgelesene Fragen zu JavaScript