使用HTML中的键获取输入类型数组值

时间:2018-01-08 08:23:09

标签: javascript arrays key

<input type='number' name="productId" id="productId" value="5">
<input type="number" name="quantity[]" id="quantity">

获取我使用的数量值

 var values = $("input[name='quantity[]']")
            .map(function(){return $(this).val();}).get();

它可以很好地获得我想要的价值。现在我想使用productId作为我的键和数量值作为数字。它有一个提交按钮。每次我将输入productID和数量它将推送数组值。我想将它们存储到一个看起来像

的新数组中
var array = {
     2:10,
     3:5
};

3 个答案:

答案 0 :(得分:0)

&#13;
&#13;
var products = [];
function addValue(){  
  var productId = $('#productId').val();
  var quantity = $('#quantity').val();
  var prod = {};
  
  if(products.filter(p=>p[productId]).length > 0){ 
      alert('The id ' + productId + ' is already included');
      return false;
  }

  prod[productId] = quantity; 
  products.push(prod);
  
  console.log(products);
  return false;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<form>
  <input type='number' name="productId" id="productId" value="5">
  <input type="number" name="quantity[]" id="quantity" value="10">
  <button onclick="return addValue()">Add value</button>
</form>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

&#13;
&#13;
window.onload = () => defineLogic();
let obj = {};
defineLogic = () => {
document.getElementById("submit").onclick = () => createArray(obj)
}

createArray = () => {
 const productId = document.getElementById("productId").value;
 const quantity = document.getElementById("quantity").value;
 obj[productId] = quantity;
 console.log(JSON.stringify(obj));
}
&#13;
<input type='number' name="productId" id="productId" value="5">
<input type="number" name="quantity[]" id="quantity">
<button id="submit">Submit button</button>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

您需要一个选择器来获取输入。如果您可以确定它们在文档中成对顺序,那么:

function getResults() {
  var inputs = document.querySelectorAll('input');
  return {[inputs[0].value] : inputs[1].value};
};
<input type='number' name="productId" id="productId" value="5">
<input type="number" name="quantity[]" id="quantity" value="2">
<br>
<button onclick="console.log(getResults())">Get results</button>

可轻松调整以从任意数量的对中创建对象。