Question

我在opencart的管理面板上有一个表单，可以计算出总产品成本并降低成本。

我有3个可编辑字段和一个总字段。

整个输入都是在KeyUp上完成的（这是由另一位开发人员建造的）

我已经制作了一些按钮，这些按钮会自动填充带有数据的字段，但是它的编码方式，它可以计算出总的onKeyUp，现在这意味着如果我点击我的按钮自动填充数据，我仍然需要点击进入字段并按任意按钮（通常为Enter），以便更新总字段。

是否有一个事件句柄可以即时运行，删除onKeyUp函数并只计算总数，所以我不需要在按下按钮后点击一个框？

<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td nowrap="nowrap"><input onKeyUp="totalcost(this.form);" type="text" name="cost" value="<?php echo $cost; ?>" style="text-align:right; background-color: #ffd7d7; border: thin solid #999;" /></td>
    <td width="40" align="center" nowrap="nowrap">=</td>
    <td nowrap="nowrap"><input onKeyUp="totalcost(this.form); if(!this.value) this.value=0; totalcost(this.form);" id="cog" type="text" name="cost_amount" value="<?php echo $cost_amount; ?>" style="border: thin solid #999;" /></td>
    <td width="50" align="center" nowrap="nowrap"><?php echo $text_cost_or; ?></td>
    <td nowrap="nowrap"><input onKeyUp="totalcost(this.form); if(!this.value) this.value=0; totalcost(this.form);" id="perc" type="text" name="cost_percentage" maxlength="5" value="<?php echo $cost_percentage; ?>" style="border: thin solid #999;" />%</td>
    <td width="40" align="center" nowrap="nowrap">+</td>
    <td nowrap="nowrap"><input onKeyUp="totalcost(this.form); if(!this.value) this.value=0; totalcost(this.form);" id="podf" type="text" name="cost_additional" value="<?php echo $cost_additional; ?>" style="border: thin solid #999;" /></td>
    <td width="40" align="center" nowrap="nowrap">+</td>
    <td nowrap="nowrap" align="left"><div id="tabs"><a href="#tab-option"><?php echo $text_cost_option_cost; ?></a></div></td>    
  </tr>
  <tr>
    <td align="center" nowrap="nowrap"><span class="help"><?php echo $text_cost; ?></span></td>
    <td>&nbsp;</td>
    <td align="center" nowrap="nowrap"><span class="help"><?php echo $text_cost_amount; ?></span></td>
    <td>&nbsp;</td>
    <td align="center" nowrap="nowrap"><span class="help"><?php echo $text_cost_percentage; ?></span></td>
    <td>&nbsp;</td>
    <td align="center" nowrap="nowrap"><span class="help"><?php echo $text_cost_additional; ?></span></td>
    <td>&nbsp;</td>
    <td align="left" nowrap="nowrap"><span class="help"><?php echo $text_cost_option; ?></span></td>    
  </tr>

  <tr>
    <td>
        <input type="button" value="POD" id="pod" />
        <input type="button" value="STK" id="stk" />

        <script>
            $(function () {
            $('#pod').on('click', function () {
                var text = $('#perc');
                text.val(0); 
                var text = $('#cog');
                text.val(1.55);   
                var text = $('#podf');
                text.val(3.10);    
            });

            $('#stk').on('click', function () {
                var text = $('#perc');
                text.val(15); 
                var text = $('#cog');
                text.val(0);  
                var text = $('#podf');
                text.val(0);    
            });



        });

        </script>

    </td>
  </tr>


  </table>

Answer 1

您的代码中所需的只是在按下按钮后设置值后调用totalcost()函数。假设您的<form>有ID form，那么您可以这样做：

<script type="text/javascript">
    $(function () {
        $('#pod').on('click', function () {
            var text = $('#perc');
            text.val(0);
            var text = $('#cog');
            text.val(1.55);
            var text = $('#podf');
            text.val(3.10);

            totalcost($('#form'));
        });

        $('#stk').on('click', function () {
            var text = $('#perc');
            text.val(15);
            var text = $('#cog');
            text.val(0);
            var text = $('#podf');
            text.val(0);
            text.val(3.10);

            totalcost($('#form'));
        });
    });
</script>

注意添加了对totalcost()的调用，我在其中传递<form id="form">选择器。如果您的表单具有不同的ID（或根本没有ID），请务必调整选择器（或<form>）。

删除输入字段上的onKeyup事件处理程序

1 个答案: