0

我有一个带有一些 jQuery 复选框的表格。单击每个复选框时，这会触发一个方法来更新底行中的总计，使用：onclick="UpdateTotalFee()"

当页面最初加载时，一切都按预期完美运行。每个复选框单击都会触发该UpdateTotalFee()方法。

出现问题的地方是在用户单击全选链接之后。这可以正确选择所有复选框，但是，随后单击复选框不再触发更新总数的方法。

当我在 firebug 中进行检查时，我可以看到的一个区别是，当页面首次加载时，单击复选框似乎是在单击span.checkboxplaceholder，但是在单击全选链接后，随后单击复选框似乎不会调用一样。

我希望我已经很好地解释了这种情况。以下是该表的完整代码：

<table border="1">
<tr>
    <th></th>
    <th style="vertical-align:middle;">Number</th>
    <th style="text-align:left; vertical-align:middle;">Owner</th>
    <th style="text-align:left; vertical-align:middle;">Address</th>
    <th style="vertical-align:middle;">Code</th>
    <th style="vertical-align:middle;">Class</th>
    <th style="vertical-align:middle;">Filing Fee</th>
    <th style="text-align:center; width:75px;">Review ?<br />
    <a href="" onclick="select_all_com(); return false"><strong>All</strong></a>
     &nbsp;&nbsp;or&nbsp;&nbsp;
    <a href="" onclick="select_none_com(); return false"><strong>None</strong></a>
    </th>
</tr>

<?php foreach ($property['commercial'] as $key => $value): ?>
    <tr>
        <th><?php echo str_pad($row++, 2, '0', STR_PAD_LEFT); ?></th>
        <td><a href= "<?php echo site_url() . "propertydetail/viewpropertydetail/" . $value['property#']; ?>"><?php echo RollNumber($value['property#']); ?></a></td>
        <td style="text-align:left"><?php echo $value['Property Owner']; ?> </td>
        <td style="text-align:left"><?php echo $value['Property Address']; ?></td>
        <td style="text-align:middle" ><?php echo number_format($value['PC'],0); ?></td>
        <td><?php echo $value['Class']; ?></td>
        <td><?php echo money_format('$%.0i', 140); ?></td>
        <td id="com" style="padding-left:25px;" onclick="UpdateTotalFee()">
<input type="checkbox" name="file_com_appeal" class="com-checkbox" value="<?php echo $value['property#'] ?>"></td>
    </tr>
<?php endforeach; ?>
    <th colspan="6" style="text-align:right; padding:1% 1% 1% 0%;">       
    <h4>TOTAL</h4><h5><span id="AppealSelected"></span></h5></th>
    <th ><h4><span id="AppealFeeTotal"></span></h4></th>
    <th></th>

这是应该在每次单击复选框时调用的 Javascript 函数：

function UpdateTotalFee(){
        var AppealCount = 0;
        $('input[name=file_com_appeal]').each(function(){
            if($(this).attr('checked')){
               AppealCount++;
            }
        });
        $('#AppealSelected').text(                                      
        (AppealCount == 0 ? '' : '(' + AppealCount + ' of ' + <?php echo count($property['commercial']);?> + (AppealCount == 1 ? ' property selected)' : ' properties selected)')));    
        $('#AppealFeeTotal').text("$"+(AppealCount*140));
    }
4

2 回答 2

1

如果它是（未）选中的，复选框会触发“ onchange”事件。所以宁愿在你的 javascript 代码中监听这个事件。然后检查是否在您的事件处理程序中选中该复选框以将更改应用于总金额。样本：

[HTML]
<input type="checkbox" name="check" id="check" value="1" onchange="updateAmount();"/>

[JS]
function updateAmount(){
     if($('input#check').is(':checked')){
           // checked
     }else{
          // unchecked
     }
}
于 2012-12-24T03:44:59.910 回答
0

请创建一个新函数并在单击全选时调用该函数并将总行数作为该函数的参数传递，以便您可以轻松计算总金额。

喜欢totalamount= count*140 并使用以下代码设置此值

$('#AppealFeeTotal').text("$"+(totalamount));
于 2012-12-24T06:59:14.557 回答