0

我正在努力实现以下目标：我有一个手风琴，里面有一系列标签。每个选项卡都有一系列输入当用户更改输入时，我想在手风琴标题上显示 3 个按钮以保存、查看待处理的更改或取消它们。到目前为止，这一切都奏效了！除了视图未决的更改。单击“查看待处理”时，我想扫描选项卡，找到任何已更改的输入并在视图按钮下方的“动态”创建的 div 中显示值（如工具提示 - 不是作为一部分的普通 div身体）。

我的想法是创建一个多维数组来存储选项卡名称、输入名称及其值，然后循环遍历数组以构建要显示的 html。

我被困在创建多维数组以及创建后如何循环遍历它。

$('#showpending').click
(
  function()
  {
     var a = $(this).siblings('div.accordion-body');
     var b = $(this);
     if ($(a).find('input.sym-changed').length > 0)
     {
        var ma = {};
        $(a).find('input.sym-changed').each(
           function()
           {
              var n=$(this).parent('div.tab-pane').attr('name');//--this to become h2
              var m=$(this).attr('name');//this to be shown as a label
              var v=$(this).attr('value'); //this to be shown as text
              alert(n); alert(m); alert(v);
               //I am stuck here!!!
              ma.n.m = v;
              alert(ma.n.m);
           }
        );
        //build a div based on the array / object 'ma'
        //show the div as tooltip for the button
     }
      else {alert('no inputs found');}
  }
)

这是我设置的 jsFiddle。http://jsfiddle.net/J6ppR/2/

4

2 回答 2

0

创建多维数组：

a=[];
for(var i=0;i<5;i++){
    a[i]=[];
    for(var j=0; j<5; j++){
        a[i][j]=j;
    }
}

循环遍历多维数组：

for(var i=0; i<a.length; i++){
    for(var j=0; j<a[i].length; j++){
        console.log(a[i][j]);
    }
}
于 2013-05-30T01:16:18.007 回答
0

你在这里需要的是一个array [] of objects {}. 它看起来像这样：

[
 { "name" : "test", "age" : 10 }, //index 0
 { "name" : "test1" ,"age": 15 } //index 1
]

您可以将所有三件事（选项卡名称、输入名称及其值）包装在 an 中object并将其推送到数组中。比多维数组更灵活。首先，您像这样声明数组：

var arr = []

然后您可以在每个循环中创建一个对象，将您需要的这三个元素添加到该对象，然后将该对象添加到数组中：

$('#showpending').click(function () {

       var tabs = $('div.accordion-body').find(".tab-pane"),
           masterArray = [];

       if (tabs.find('input.sym-changed').length > 0) {

           tabs.each(function () {
               var obj = {};

               //tab name
               obj.tabName = $(this).attr("name");
               obj.tabArray = [];


               //key and the value array
               $(this).find("input:text").each(

               function () {
                   obj.tabArray.push({
                       "name": $(this).attr('name'),
                           "value": $(this).val()
                   });
               });

               masterArray.push(obj);
           });
       } else {
           alert('no inputs found');
       }


       $.each(masterArray, function (i, tab) {
           $("body").append("<div id='placeholder'></div>");
           var inputs = function () {
               var inp = "";
               $.each(tab.tabArray, function (i, data) {
                   inp += "<li>" + data.name + " : " + data.value + " </li>";
               });
               return inp;
           }();
           $("#placeholder").append("<h1>" + tab.tabName + "</h1><ul>" + inputs + "</ul>");



       });
   });

你可以用任何你想要的方式构建你的对象，但是在你的情况下使用对象是最好的方法。

编辑

对于您当前的情况，我们可以使用这种结构的对象，该对象可以推送到数组中。

[
 {
  "tabName" : "details",
  "tabArray" : [
                 {"name": "cust_name", "value" : "Test company" },
                 {"name": "cust_reg_name ", "value" : "Registered " }
               ]
 },

 ..and so on
]

这样，它也会接受你给它的尽可能多的输入。这是您更新的小提琴：http: //jsfiddle.net/J6ppR/6/

于 2013-05-30T01:37:09.803 回答