Входное значение внутри внутреннего HTTML

Question

function createJSON() { 
    var data = new Object(); 
    $("input[class = detail_text]").each(function() { 
     data[$(this).attr("name")] = $(this).val(); 
     jsonString = JSON.stringify(data); 
    }); 
    console.log(jsonString); 
} 

Я пытаюсь получить значение ввода в innerHTML. Эти поля ввода многозначны. Как получить эти атрибуты? В моем коде последний - единственный, который получает спасение. Я новичок в этом. Благодарю.

<div class="window task" style="left: 120px; top:200px; display:none;" data-nodetype="task" id="taskcontainer0"> 
     <div class="ctrl_container"> 
      <div class="button_remove">x</div> 
     </div> 
     <div class="details_container"> 
      <label class="detail_label">Name</label> 
      <input type = "text" class="detail_text" name = "task"/><br/> 
      <label class = "detail_label">Description</label> 
      <input type = "text" class ="detail_text" name = "msg"> 
     </div> 
     </div> 

Это код html.

Answer 1

Если поля многозначным, вы, вероятно, хотите, чтобы хранить массивы для каждого имени, см инлайн комментарии:

function createJSON() { 
    var data = {}; // {} is usually better than new Object 

    $("input[class = detail_text]").each(function() { 
     var $this = $(this), 
      name = $this.attr("name"); 

     // Is there already a value saved for this name? 
     if (!data.hasOwnProperty(name)) { 
      // No, create a blank array 
      data[name] = []; 
     } 

     // Add this value to the array of values for this name 
     data[name].push($this.val()); 
    }); 

    jsonString = JSON.stringify(data); 

    console.log(jsonString); 

} 

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

Или, если вы хотите только массив если у вас есть несколько значений для данного name, то:

function createJSON() { 
    var data = {}; // {} is usually better than new Object 

    $("input[class = detail_text]").each(function() { 
     var $this = $(this), 
      name = $this.attr("name"); 

     // Is there already a value saved for this name? 
     if (!data.hasOwnProperty(name)) { 
      // No, save this value 
      data[name] = $this.val(); 
     } 
     else { 
      // Yes, is it an array? 
      if (!Array.isArray(data[name])) { 
       // No, make it one 
       data[name] = [data[name]]; // Wraps the existing value in an array 
      } 

      // Add this value to it 
      data[name].push($this.val()); 
     } 
    }); 

    jsonString = JSON.stringify(data); 

    console.log(jsonString); 

} 

Array.isArray является ES5 вещь, но шайба тривиальна:

if (!Array.isArray) { 
    Array.isArray = (function() { 
     var toString = Object.prototype.toString; 

     return function(arg) { 
      return toString.call(arg) === "[object Array]"; 
     }; 
    })(); 
} 

---

Замечание: вы почти никогда не хотите использовать селектор атрибутов ("input[class = detail_text]") для выбора по clas s, потому что, конечно, элементы могут иметь несколько классов. Вместо этого используйте селектор классов: "input.detail_text"