javascript - JqueryでDropdownListをJsonに変換する方法

Question

次のようなドロップダウンリストリストが1つあります。

<select id="sample" >
  <option value="1">FRIEND</option>
  <option value="2">GOOGLE</option>
  <option value="3">AGENT</option>
</select>

ドロップダウンリストを次のようにJsonfromatに変換する必要があります。

 var json={"FRIEND:"1","GOOGLE":"2","AGENT":"3"}

誰か助けてください。

Answer 1

var json = {};
$("#sample option").each(function() {
    json[$(this).text()] = $(this).val();
});

Answer 2

<select id="sample" >
    <option value="1">FRIEND</option>
    <option value="2">GOOGLE</option>
    <option value="3">AGENT</option>
</select>
<script type="text/javascript">
    var obj = {};
    $("#sample option").each(function (i, op) {
        obj[$(op).text()] = $(op).val();
    });
    var s = JSON.stringify(obj);
    alert(s);
</script>

Answer 3

それは簡単です！

var json = {};
var select = document.getElementById('sample');
var options = select.options,option;
for (var i=0,len=options.length;i<len;i++) {
    option = options[i];
    json[option.innerHTML] = option.value;
}

今、jsonオブジェクトはあなたが望むものです！

Answer 4

これを行う

var x=document.getElementById("sample"),
    y=x.options,
    obj={} 
for(var i=0,len = y.length;i<len;i=i+1){
    obj[y[i].text] = i+1;
}

今、あなたは単に呼び出すことができます

obj["FRIEND"]
obj["GOOGLE"]

Answer 5

jqueryなしで静的オブジェクトを作成できます

​var data = new Object();
data.FRIEND= 1;
data.GOOGLE= 2;
data.AGENT= 3;

アップデート

var data = new Object();

$('#sample option').each(function(e){
    var value = $(this).val();
    var key = $(this).text();
    console.log('"' + key + ':' + value);
    data[key] = value;
});

var json = JSON.stringify(data);
console.log('---- using JSON.stringify ----');
console.log(json);

var obj = $.parseJSON(json);
console.log('---- using jQuery parseJSON ----');
console.log(obj);

Answer 6

jqueryのmap関数を使用できます。

var items = $("#sample > option").map(function() {
var arr = {};
arr[$(this).text()] = $(this).val();
return arr;
}).get();

alert(JSON.stringify(items));

Answer 7

jQueryの場合：

var options = $('#sample option'),
form = {};
options.each(function (​key, val) {
   form[$(val).text()] = $(val).val();
});

または純粋なJSの場合：

var options = document.querySelectorAll('#sample option'),
form = {},
i = 0;
for (; i < options.length; i++) {
   form[options[i].innerHTML] = options[i].getAttribute('value');
}