0

好的，所以我在使用 jquery 方面相当新（我多年来一直在使用插件），我根本不知道发生了什么。

我有一个表格（一个基于两个用户输入数字的乘法网格）。顶行标题和最左列是按顺序生成的。到目前为止，一切都很好。

现在，我正在尝试计算网格的值，所以 x2 * y2 = 网格值。我计划一次处理 1 行（因为我的数学大脑不允许我为整个网格制定公式）。我像这样提取 x 行标题的值：

var yHead = $('.y-head.y2').text();
var xHead = $('.x-head.x2').text();
console.log(xHead);
console.log(yHead);

好吧，我得到了我想要的（好吧，我得到了正确的数字 22 次，因为它在每个循环中的 jquery 中。所以我得到了 22 次）。 但是y 列标题我得到了奇怪的值 70 和我想要的值。（由于循环，再次各 22 次）。

1）为什么我得到 22 而不是每个循环的 11 次迭代？2）控制台日志中的 70 到底是从哪里来的？

从字面上看，这个头发正在脱落......我试过.text（），.html（），.val（）

jsFiddle - 我正在处理的行是红色的，js 在第 22 行，产生到70

4

2 回答 2

0

我的第一个怀疑似乎是正确的：从$y2技术上讲，它是一个字符串（在调试时确认了这一点）。

如果你更换

$(this).html($x2 + i);
//and
$(this).html($y2 + i);

和

$(this).html(parseInt($x2) + i);
//and
$(this).html(parseInt($y2) + i);

它应该按照您希望的方式工作。因为如果你有一个字符串"7"并将数字附加0到它上面，它将是"70".

于 2013-11-08T19:07:16.163 回答
0

好吧...所以你有一些问题...

我的：http: //jsfiddle.net/Ja7QM/3/

这是你的代码...

// the main issue you were having had to deal with the assignment of these two 
// variables... I'm still not sure where that 70 was coming from but it was
// due to the different places and ways you assigned values to $x2 and $y2 
$y2 = $("input#Y").val();
$x2 = $("input#X").val();


    // this is your headers()
    function headers() {
    // set the heading of the grid to the values 5 lower and 5 higher than input
        $('.x-head').each(function(i) {
            $(this).html($x2 + i);
        });

    // set the heading of the grid to the values 5 lower and 5 higher than input
        $('.y-head').each(function(i) {
            $(this).html($y2 + i);
        });

    }; 
    // and mine... not much different but I used text() instead. 
    // I'm not sure it matters, really... 
    function my_headers() {   
         $('.x-head').each(function(i) { $(this).text(x2 + i); }); 
         $('.y-head').each(function(i) { $(this).text(y2 + i); }); 
    };

    // your calculate... 
    function calculate() {
    // calculate grid values (column at a time)
    $('.content.x0').each( function(i){

            var yHead = $('.y-head.y2').text();
            var xHead = $('.x-head.x2').text();
            console.log(yHead);
        })

    };


// my calculate function... be warned: I am not good at selectors.  there 
// might be a better, more efficient way... this is just the first thing 
// that worked for me... sorry.
function calculate() {  

    // find all the TR's except the first one, and go through each TD
    $('table tr:gt(0) > td').each(function(){  
        if ($(this).hasClass('content')) {

            // figure out what the Y value is for the first TD of this row 
            var y = $(this).parent('tr').find('td:eq(0)').text(); 

            // found this here: http://stackoverflow.com/questions/788225
            // to get the column number of the current TD
            var col = $(this).parent().children().index($(this)); 

            // k, so now we need that X value.  find the first tr of this table 
            // and find the td in the same column as the current TD
            var x = $(this).closest('table')
                           .find('tr:eq(0)')
                           .find('td').eq(col).text();

            x = parseInt(x,10);  // for safety in numbers 
            y = parseInt(y,10);

            $(this).text((x*y).toString());  // for safety in strings...?
        }
    });   
};


// I moved this over to the CSS because it kept getting in my way.... 
$('.content.x0').css("color", "red");

//set input A to pos x2 on the grid
$("input#X").keyup(function () {
  var value = $(this).val();
// set global var of x2 based on x input
  $x2 = $(this).val() - 5;
  headers();
  calculate();
}).keyup();


// set input B position y2 on the grid
$("input#Y").keyup(function () {
    var value = $(this).val();
// set global var of x2 based on x input
    $y2 = $(this).val() - 5;
    headers();
    calculate();
}).keyup();

// i just made those one thing and set x and y 
// things to update  for any change...  
//set input A to pos x2 on the grid
$("input#X, input#Y").keyup(function () {  
    x2 = $("input#X").val() - 5;
    y2 = $("input#Y").val() - 5;      
    headers();
    calculate();
}).keyup();
于 2013-11-08T19:19:01.670 回答