Question

我正在创建一个脚本，将HTML选择器转换为可自定义的菜单。我需要从HTML中返回一个嵌套的Object（如图2）。

即归还图1

 <select id="orderBy">                  
    <option value="order-by=newest&">newest</option> 
    <option value="order-by=relevance&">relevance</option>
 </select>
<select id="searchBy">                  
    <option value="search-by=name&">name</option> 
    <option value="search-by=number&">number</option>
</select>

像这样的对象

：图2

selectors = [       
    {"id":"orderBy", "options" : [
        {"value":"search-by=newest&", "name":"search-by=relevance&"}
    ]},
    {"id":"searchBy", "options" : [
        {"value":"search-by=name&", "name":"search-by=number&"}
    ]}
];

我的代码到目前为止，虽然这不起作用。

var selector = new Object;

//Find all select boxes and push their ID's' into selector
$("#filter").find("select").map(function(i){
  selector[i] = this.id;
});

//Find all select boxes and push their ID's' into selector
$("#" + selector[i]).find("option").map(function(i){
  optionText[i] = $(this).text();
  optionValue[i] = $(this).val();
});

摘要

上面的代码返回

Object {0: "orderBy", 1: "searchBy"}.

我做错了什么？

Answer 1

为了使用map()创建数组，您需要在回调中返回一个对象。

你可能想要更像

的东西

var data = $('#container select').map(function(){
   // create array of option objects for this select instance
   var opts = $(this).children().map(function(){
      // return an object for each element of array
     return{
       text:  $(this).text(),
       value: this.value
     }
   }).get();
   // now an object for this select instance
   var obj={
     id:      this.id,
     options: opts // array from above   
   }
   return obj;   

}).get();

的 DEMO

将HTML选择器转换为Object

1 个答案: