0

请帮助我是新手。我想进行计算（所选值可被 1000 整除）和乘以 Amount 并且应该存储在第 5 列中。即 Product1 = (100 / 1000) * 100 = 10

这是我的代码：

<table border="1">
<tbody>
    <tr>
        <td width="334">S.No.</td>
        <td width="334">Product Name</td>
        <td width="334">Amount</td>
        <td width="334">Grams/Kg</td>
        <td width="334">Final Amount</td>
    </tr>
    <tr align="center">
        <td>1</td>
        <td>Product1</td>
        <td>100</td>
        <td>
            <select id="grams">
                <option value=""></option>
                <option value="100">100g</option>
                <option value="250">250g</option>
                <option value="500">500g</option>
            </select>
        </td>
        <td>I want to do calculation (selectedvalue / 1000) * Amount, that amount want to reflect here</td>
    </tr>
    <tr align="center">
        <td>2</td>
        <td>Product2</td>
        <td>200</td>
        <td>
            <select id="grams">
                <option value=""></option>
                <option value="100">100g</option>
                <option value="250">250g</option>
                <option value="500">500g</option>
            </select>
        </td>
        <td>I want to do calculation (selectvalue / 1000) * Amount, that amount want to reflect here</td>
    </tr>
</tbody>

4

2 回答 2

1

这可能会帮助您了解如何格式化表格以获取值

$(function(){
  $('select').change(function(){
        var td_id = 'row'+$(this).attr('id');
        var val = $(this).val();
        var amount = $('.'+td_id+'-amount').html();
        $('#'+td_id).html(val/1000*amount);
  });
});

在示例中，您必须添加一些额外的ids和classes. 见小提琴

（我以为你想要超过 2 行。在你的情况下，其他答案可能更容易使用）

于 2013-04-05T12:58:16.093 回答
1

首先，不能有两个具有相同 id 的元素。ID 需要唯一。因此，您需要更改第二个选择框的 ID。

然后，我在 td 上放置了一个 id 来进行计算，并在 td 上放置了一个包含金额的 id。

<table border="1">
<tbody>
<tr>
    <td width="334">S.No.</td>
    <td width="334">Product Name</td>
    <td width="334">Amount</td>
    <td width="334">Grams/Kg</td>
    <td width="334">Final Amount</td>
</tr>
<tr align="center">
    <td>1</td>
    <td>Product1</td>
    <td id="amtFirst">100</td>
    <td>
        <select id="grams">
            <option value=""></option>
            <option value="100">100g</option>
            <option value="250">250g</option>
            <option value="500">500g</option>
        </select>
    </td>
    <td id="firstCalculation"></td>
</tr>
<tr align="center">
    <td>2</td>
    <td>Product2</td>
    <td id="amtSecond">200</td>
    <td>
        <select id="secondGrams">
            <option value=""></option>
            <option value="100">100g</option>
            <option value="250">250g</option>
            <option value="500">500g</option>
        </select>
    </td>
    <td id="secondCalculation"></td>
</tr>
</tbody>

然后你需要使用jquery：

//handles the first select box
$('table').on('change','#grams',function(){
    var selection = $(this).val();
    var amount = $('#amtFirst').html();

    selection = (selection/1000)*amount;
    $('#firstCalculation').html(selection);
});

//handles the second select box
$('table').on('change','#secondGrams',function(){
    var selection = $(this).val();
    var amount = $('#amtSecond').html();

    selection = (selection/1000)*amount;
    $('#secondCalculation').html(selection);
});
于 2013-04-05T13:00:10.693 回答