隱蔽表單數據到JSON字符串

Question

<form name = 'test' >
    <input type='text' name = 'login'>
    <input type='email' name = 'email'>
</form>

如果我使用JSON.serialize($(form)).serializeArray();
我得到[{"name":"login","value":"a value"},{"name":"email","value":"a email"}]而我需要{"login":"a login","email":"a email"} 。 怎么做？？

Answer 1

您可以使用此：

JSON.stringify($(form).serializeArray().reduce((acc, f) => {
  acc[f.name] = f.value
  return acc
}, {})

Answer 2

您可以將<form>傳遞給FormData() ，迭代鍵， FormData實例的值對，將每個鍵和值設置為對象的屬性和值

 let form = document.forms["test"]; let fd = new FormData(form); let data = {}; for (let [key, prop] of fd) { data[key] = prop; } data = JSON.stringify(data, null, 2); console.log(data); 

 <form name='test'> <input type='text' name='login' value="a login"> <input type='email' name='email' value="a email"> </form> 

Answer 3

另一種方法，使用純js和form.elements作為Array.reduce的參數

 var d = [].reduce.call(document.forms['test'].elements,(a,b)=>(a[b.name]=b.value,a),{}); var j = JSON.stringify(d, 0, 4); console.log(j); 

 <form name='test'> <input type='text' name='login'> <input type='email' name='email'> </form> 

使用jQuery

 var data = $('form :input').toArray().reduce( (a,b) => (a[b.name]=b.value,a),{}) var json = JSON.stringify(data,0,4); console.log(data); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form name='test'> <input type='text' name='login'> <input type='email' name='email'> </form> 

Answer 4

如果要使用javascript對象：

 let dest = {};
 $( form )
     .serializeArray()
     .map( input => dest[ input.name ] = input.value );

和傑森：

 console.log( JSON.stringify( dest ) );

Answer 5

如果你得到這個

[{"name":"login","value":"a value"},{"name":"email","value":"a email"}];

而你只需要

{"name":"login","value":"a value"}

只需按其索引調用變量

 var data = [{"name":"login","value":"a value"},{"name":"email","value":"a email"}]; console.log( data[0] ) 

Answer 6

使用.serializeArray（）的真正快速解決方案是：

var objArr = JSON.serialize($(form)).serializeArray();
var obj = objArr.pop();
var strJson = JSON.serialize(obj);