Jquery生成具有XY值的输入元素

时间:2014-02-20 03:04:44

标签: javascript jquery

我正在尝试生成包含坐标XY等值的输入元素。

此图片将解释我在寻找什么。

Character for Column and Number for Row

从上图中可以看出每个输入的值是A1,B1,C1,...,D5,E5。 我已经定义了生成的数字输入的大小,5x5。

下面是我生成元素的代码加上值的增量编号。 但我不知道如何修改它。

$(document).ready(function() {
   var a = 5, b = 5, val = a*b;

   $("#seatwrapper").each(function() {
      var arrseat = new Array();
      arrseat['this'] = ['X', 'X', 'X', 'X', 'C1', 'C1', 'C1', 'C1', 'C2', 'C2', 'C2', 'C2', 'X', 'X', 'X', 'X', 'C1', 'C1', 'C1', 'C1', 'C2', 'C2', 'C2', 'C2', 'X'];

      var abcd = new Array();
      abcd['this'] = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']; // I have no idea to add Increment Character as Column ID

      // go thru the main array
      for (var key in arrseat) {
         // go thru the inner arrays
         var arr = arrseat[key];
         for (i = 0, n = arr.length; i < n; i++) {
            var _select = $('<input></input>', {class: 'seat dropdown ' + arr[i] + '', name: 'seatlist', type: 'text', value: i+1});
            $("#seatwrapper").append(_select);
         }
      }       
   });  
   $('#seatwrapper').css('width',b*40+6);
});

这是jsbin中的现场演示:http://jsbin.com/weq/2/edit

1 个答案:

答案 0 :(得分:0)

这是固定的JS Bin!

但你在底部有一些警告!

你需要计算行数并使用一些模运算,瞧!