如何使用Javascript在HTML表格中动态生成列

时间:2016-03-13 15:17:31

标签: javascript html

    public class SomeActivity extends Activity
{
    private static final int UPDATE_BUTTON_TEXT = 1;
    private static final SomeActivity me = null;

    private static Handler handler = new Handler() { 
        public void handleMessage(Message msg)  {
          if (me == null) return;

          switch (msg.what)  {
            case UPDATE_BUTTON_TEXT:
              Button btn = (Button) me.findViewById(R.id.someButton);
              btn.setText((String) msg.obj);
          }
        }
    };

    private View.OnClickListener onClickListener = new View.OnClickListener() {
       public void onClick(View view) {
            new SomeLongRunningTask().execute();
        }
    };

    private static class SomeLongRunningTask extends AsyncTask<Void, Void, Boolean> {

        private Handler handler;

        public SomeLongRunningTask(Handler handler)  {
            this.handler = handler;
        }

        @Override
        protected Boolean doInBackground(Void... voids) {

            try {
                Thread.sleep(30000); // replace with some background logic
            } catch (InterruptedException e) {}

            return true;
        }



          @Override
            protected void onPostExecute(Boolean aBoolean) {
//can the handler be null here if activity is destroyed ????
                Message msg = handler.obtainMessage(UPDATE_BUTTON_TEXT);
                msg.obj = "success"
                handler.sendMessage(msg);
            }
        }

    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        final Button someButton = (Button) findViewById(R.id.someButton);
        someButton.setOnClickListener(onClickListener);
    }

    @Override
    protected void onStart() {
        super.onStart();

        me = this;
    }

    @Override
    protected void onStop() {
        me = null;

        super.onStop();
    }
}

我尝试使用上述方法在表格中动态创建行和列。它仅适用于外环,即保持列固定。我想要不。根据函数参数中传递的值动态确定列的数量。不知怎的,内循环不起作用。

我在做语法错误吗?

提前致谢!

修改

预期输出:

<script>

   function generateCaseDetails(array, n)
   {
     row = '';

     for( i = 0;i<array.length;i=i+n)
     {
        row+=
        '<tr class = "'+(i%2==0 ? 'even' : '')+'">'+
         for(j = 0; j < n ; ++j)
         {
            '<td><label>'+array[i+j].label+'</label><div>'+array[i+j].value+'</div></td>'+

         }
        '</tr>'
     }

     document.write(row);
   }

   a = 12.5;
   b = 0.3;
   c = 3.4;
   d = 1.2;

   caseDetails = [
     {"label":"30 day exception ratio", "value":a},
     {"label":"30 day exception turn ratio", "value":b},
     {"label":"60 day exception ratio", "value":c},
     {"label":"60 day exception turn ratio", "value":d}
   ]

  generateCaseDetails(caseDetails, 2);
</script>

1 个答案:

答案 0 :(得分:1)

您正尝试将字符串与for循环联接:

    row+=
    '<tr class = "'+(i%2==0 ? 'even' : '')+'">'+
     for(j = 0; j < n ; ++j)

这不起作用,你的javascript控制台应该给你一个合理的错误信息。

只需使用; - 终结符结束第一行,并在内部循环中使用row +=添加字符串。同样,以;而不是+结束。

当然,最后一个</tr>也需要前面的row +=

您的内部循环应如下所示:

    row += '<tr class = "'+(i%2==0 ? 'even' : '')+'">';
     for(j = 0; j < n ; ++j)
     {
        row += '<td><label>'+array[i+j].label+'</label><div>'+array[i+j].value+'</div></td>';

     }
    row += '</tr>';

尽管如此,我不明白你想用array[i+j]做些什么。