如何使用JQuery从GRID获取值？

Question

只想问一下您是否可以帮助我解决我的问题，

我在表单中使用JQuery创建了一个网格，我想获取用户在该网格上输入的值并将其保存到数据库中。

流程像这样

首先，他们将选择否。 的网站（要阴影的单元数），然后他们将点击所需的正确单元。 然后问题开始后，如何获得他们输入的值，然后保存它。

这是我的代码的工作演示：

http://jsfiddle.net/reymartinaruta/qnm96/

var CMAP = function() {

    // animation
    var blink = function(id)
    {
        $(id).animate({opacity: 0.2}, 300).delay(400)
                .animate({opacity: 1}, 300,
                function()
                {
                    blink();
                }
        );
    };

    return {
        //create map function to initiate the module
        initCreateMAP: function()
        {
            var html = '<table>';
            for (i = 0; i < 15; i++)
            {
                html += "<tr>";
                for (j = 0; j < 15; j++)
                {
                    html += '<td><div id="p' + ((i * 15) + j)  + '" class="mappoint" style="width:20px; height:20px;"></div></td>';
                }
                html += "</tr>";
            }

            html += "</table>";            
            $('#layout').html(html);

        },

        // main function to initiate        
        initCMAP: function()
        {            
            var Point = new Array();

            $('#select5').change(function(){
                Point.length =  0;
                $(".mappoint-change").each(function () {
                        $(this).removeClass('mappoint-change');
                        $(this).html('');
                });

                for(i=0; i < parseInt($('#select5').val()); i++) Point.push(i);

            });

              $('.mappoint').click(function() {

                  var text = $(this).text();

                  if(text != '')
                  {
                      Point.unshift(parseInt(text));
                      $(this).html('');
                      $(this).removeClass('mappoint-change');
                  }
                  else
                  {
                        Point.sort(function(a,b){
                            return a-b;
                        });

                        if(Point.length == 0) return false;

                        for(var i in Point)
                        {
                              $(this).addClass('mappoint-change');
                              blink(this);
                              $(this).html(Point[i]);
                              Point.shift();
                              break;
                        }
                  }
              });              

           var data = new Array();
           //var data = [ "p0", "p1", "p2", "p33", "p49", "p65", "p127", "p140", "p141", "p142"];

           $('#submit').click(function() {
//                $.post('cmap.action.php', $('#requestfrm').serialize(),
//                        function(data) {
//                            $('#rq-info').html(data);
//                        }
//                );

//                for(i=0; i<data.length; i++)
//                {
//                    $('#' + data[i]).addClass('mappoint-change');
//                    $('#' + data[i]).html(i);
//                }

                $(".mappoint-change").each(function () {                    
                     data.push(this.id);
                });

            });

            $('#reset-cmap').click(function() {
                if(confirm("Do you want to reset your map?"))
                {    
                    $(".mappoint-change").each(function () {
                        Point.unshift(parseInt($(this).text()));
                        $(this).removeClass('mappoint-change');
                        $(this).html('');
                    });
                }
            });
        }       
    };

}();

非常感谢你。

Answer 1

试试这个代码。 它读取ID并将其转换为X和Y坐标

演示： jsFiddle

        var pointOrder=$(this).attr("id").replace("p","");
        pointOrder=parseInt(pointOrder);

        var corX=parseInt(pointOrder/15);
        var corY=pointOrder%15;