0

jQuery 新手需要帮助。我正在为一个梦幻足球网站编写一个数据库应用程序。它从数据库中提取玩家信息并将其显示在前端的表格中以供查看者查看。你可以在这里看到它的半功能版本:

http://digitaldemo.net/kickass/projections-table.php

我很难使用的一项功能是 TFP(总幻想点数)计算。在上述链接的第一个选项卡中,有一系列下拉菜单。有些是选择点值(例如 2 分),有些是选择增量(例如每 10 码)。

首次加载页面时,需要使用默认值预先选择这些下拉菜单,并且 TFP 列会根据初始计算填充总计。

然后,用户可以更改这些值,点击 Get TFP Scores 按钮,TFP 列中的总分就会发生变化。

我该怎么做呢?

4

2 回答 2

1

Cynthia,您需要将 id 添加到各种 HTML 元素,然后添加一些 javascript,如下所示:

$(function(){
    function calcTFP(e) {
        if(e) e.preventDefault();

        var $tds, Pass_Yds, Pass_TDs, Int, Rush_Yds, Rush_TDs, Overall_Pts, TFP;

        $("tbody#qb tr").each(function() {
            $tds = $(this).find("td");
            Pass_Yds = Number($tds.eq(2).text());
            Pass_TDs = Number($tds.eq(3).text());
            Int = Number($tds.eq(4).text());
            Rush_Yds = Number($tds.eq(5).text());
            Rush_TDs = Number($tds.eq(6).text());

            TFP = Number($s_pass_yds_pts.val()) * Math.floor(Pass_Yds / Number($s_pass_yds_yds.val()));
            TFP += Number($s_pass_tds_pts.val()) * Pass_TDs; 
            //TFP += ........; //for Rushing yds, based on Passing yds.
            //TFP += ........; //for Rushing TDs, based on Passing TDs.
            //TFP += ........; //for Ints Thrown, based on Passing TDs.

            $tds.eq(8).text(TFP);//display calculated points in row's TFP column
        });
    }

    //Passing Yds
    var $s_pass_yds_pts = $("#s_pass_yds_pts").on('change', calcTFP);
    var $s_pass_yds_yds = $("#s_pass_yds_yds").on('change', calcTFP);

    //Passing TDs
    var $s_pass_tds_pts = $("#s_pass_tds_pts").on('change', calcTFP);

    //Rushing Yds
    //add code here based on Passing Yds

    //Rushing TDs
    //add code here based on Passing TDs

    //Int Thrown
    //add code here based on Passing TDs

    $("#b_get_TFP_scores").on('click', calcTFP);//attach calcTFP as click handler to "get_TFP_scores" button

    calcTFP();//initial calculation on page load
})

演示在这里

您会看到代码只是部分完成了,但那里应该有足够的内容,包括注释,以便您弄清楚如何编写其余部分。一旦你对正在发生的事情有所了解,添加额外的代码将是非常机械的。

您还将看到 [Get TFP Scores] 按钮是多余的,因为计算是自动执行的 (a) 页面加载和 (b) 响应对选择菜单所做的更改。但是,我已将按钮留在原处。

编辑:

五分量计算分为两类:

  • [通过Yds和Rashing Yds],一般公式为pts = s1 * score / s2
  • [传球、冲球和拦截],其中一般公式为pts = s1 * score

上面我已经完成了两个示例计算(用于通过 Yds 和通过 TDs),即。每个类别中的一个。您需要根据适当的样本处理其他三个。

如果您还没有这样做,请记住还要添加(如在演示中):

  • <select>您和<tbody>元素的唯一 ID ,
  • 元素的值属性<option>
于 2012-06-01T04:21:50.030 回答
0

首先,要预先选择您必须拥有服务器的值,或者您必须对它们进行硬编码才能进行预先选择。如果您的服务器正在输出它们(即从数据库中),那么您应该通过后端将选择设置为正确的值。

现在让我们进入代码:

function calcTfp() {
   // here you are doing your calcuation
   $('tr').each(function(i) {
       var tfp = 1+2+3; // this is for you to define
       $('td:eq(8)', this).val(tfp);
   });
}

如果要在客户端预选值,只需添加以下内容:

function Preselect() {
   $('#passingYds').val('1 pt');  // these values depend on your implementation
   $('#passingTds').val('4 pts'); 
   // etc
 }

$(document).ready(function() {
  // preSelect();  // If you want to preset values on client side
  calTfp();  // on page load do all the tfp calcs

  // when the button is clicked do the tfp calcs
  $('#btnTfp').click(function(e) {
     e.preventDefault();
     calcTfp();
  });


});
于 2012-06-01T02:51:40.407 回答