it-swarm.com.de

Dynamisches Erstellen eines JSON mit jedem Eingabewert mithilfe von Jquery

Ich habe eine Situation, in der ich einige Daten aus einem JSON-Format über PHP auslesen möchte. Allerdings habe ich einige Probleme damit, wie ich das Javascript-Objekt konstruieren sollte, um das JSON-Format dynamisch zu erstellen. 

Mein Szenario sieht wie folgt aus:

<input title="QA" type="text" class="email">
<input title="PROD" type="text" class="email">
<input title="DEV" type="text" class="email">

Der Javascript-Code, den ich bisher durchläuft, greift bei jeder Eingabe auf die Daten, ich kann jedoch nicht verstehen, wie er von hier aus verarbeitet werden soll.

var taskArray = {};

$("input[class=email]").each(function() {
  var id = $(this).attr("title");
  var email = $(this).val();

  //how to create JSON?

});

Ich möchte, wenn möglich, folgende Ausgabe erhalten.

[{title: QA, email: '[email protected]'}, {title: PROD, email: '[email protected]'},{title: DEV, email: '[email protected]'}]

Wo wird die E-Mail vom Eingabefeldwert abgerufen.

Jeder Lichteinfall in dieser Situation wird sehr geschätzt!

74
BaconJuice

So was:

function createJSON() {
    jsonObj = [];
    $("input[class=email]").each(function() {

        var id = $(this).attr("title");
        var email = $(this).val();

        item = {}
        item ["title"] = id;
        item ["email"] = email;

        jsonObj.Push(item);
    });

    console.log(jsonObj);
}

Erklärung

Sie suchen nach an array of objects. Sie erstellen also ein leeres Array. Erstellen Sie für jede input ein Objekt, indem Sie "title" und "email" als Schlüssel verwenden. Dann fügen Sie jedes der Objekte zum Array hinzu.

Wenn Sie einen String brauchen, dann tun Sie das

jsonString = JSON.stringify(jsonObj);

Beispielausgabe

[{"title":"QA","email":"[email protected]"},{"title":"PROD","email":"[email protected]"},{"title":"DEV","email":"[email protected]"}] 
229
ATOzTOA

Ich glaube nicht, dass Sie JavaScript-Objekte nur mit jQuery in JSON-Strings umwandeln können, vorausgesetzt, Sie benötigen den JSON-String als Ausgabe.

Abhängig von den Browsern, auf die Sie abzielen, können Sie mit der Funktion JSON.stringify JSON-Zeichenfolgen erstellen.

Weitere Informationen finden Sie in http://www.json.org/js.html . Dort finden Sie auch einen JSON-Parser für ältere Browser, die das JSON-Objekt nicht nativ unterstützen.

In Ihrem Fall:

var array = [];
$("input[class=email]").each(function() {
    array.Push({
        title: $(this).attr("title"),
        email: $(this).val()
    });
});
// then to get the JSON string
var jsonString = JSON.stringify(array);
11
ChrisF

Vielleicht hilft dies, ich würde, wo immer möglich, reines JS bevorzugen. Es verbessert die Leistung drastisch, da Sie nicht viele JQuery-Funktionsaufrufe haben.

var obj = [];
var elems = $("input[class=email]");

for (i = 0; i < elems.length; i += 1) {
    var id = this.getAttribute('title');
    var email = this.value;
    tmp = {
        'title': id,
        'email': email
    };

    obj.Push(tmp);
}
8
Salman

Sie können dies auch durch den folgenden Code erreichen.

 let str = '{" + yourKey + ":'+yourValue+'}';
 str = JSON.parse(str);
0