it-roy-ru.com

Динамическое создание JSON с каждым входным значением с использованием jquery

У меня возникла ситуация, когда я хотел бы прочитать некоторые данные из формата JSON через PHP, однако у меня возникли некоторые проблемы с пониманием того, как я должен сконструировать объект Javascript для динамического создания формата JSON. 

Мой сценарий выглядит следующим образом:

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

Код Javascript, который у меня есть, проходит через каждый ввод данных, но я не могу понять, как с этого момента работать.

var taskArray = {};

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

  //how to create JSON?

});

Я хотел бы получить следующий вывод, если это возможно.

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

Где электронная почта получена значением поля ввода.

Любой свет, пролившийся на эту ситуацию, будет высоко оценен!

74
BaconJuice

Как это:

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);
}

Объяснение

Вы ищете an array of objects. Итак, вы создаете пустой массив. Создайте объект для каждой input, используя «title» и «email» в качестве ключей. Затем вы добавляете каждый из объектов в массив.

Если вам нужна строка, то сделайте

jsonString = JSON.stringify(jsonObj);

Пример вывода

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

Я не думаю, что вы можете превратить объекты JavaScript в строки JSON, используя только jQuery, при условии, что вам нужна строка JSON в качестве вывода.

В зависимости от браузеров, на которые вы ориентируетесь, вы можете использовать функцию JSON.stringify для создания строк JSON.

См. http://www.json.org/js.html для получения дополнительной информации, там также можно найти анализатор JSON для старых браузеров, которые изначально не поддерживают объект JSON.

В твоем случае:

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

Может быть, это поможет, я бы предпочел чистый JS везде, где это возможно, это резко повышает производительность, так как у вас не будет много вызовов функций JQuery.

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

Вы также можете добиться этого с помощью следующего кода.

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