Создание 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]'}]

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

Любые легкие прокладки на этой ситуации будут очень благодарны!

Ответы

Ответ 1

Вот так:

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]"}]

Ответ 2

Я не думаю, что вы можете превратить объекты 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);

Ответ 3

Может быть, это поможет, я бы предпочел бы чистый 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);
}

Ответ 4

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

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