文本框中的动态计算?

时间:2013-07-24 21:58:17

标签: php javascript

我对PHP很新,并尝试在电子邮件表单中构建动态部分,其中有两个文本框并排。第一个是数量,第二个是总数。

我希望它将第一个文本框乘以设定值15,然后在第二个总文本框中显示该结果,该文本框将是只读的。

关于我如何做到这一点的任何建议?我一直在网上搜索寻找帮助多年,但我似乎找不到任何帮助。

我现有的表单代码是:

<table width="500" border="0" cellpadding="0" class="t4">
    <tr>
      <td width="48">Code</td>
      <td width="196">Event</td>
      <td width="56">Cost</td>
      <td width="66">Number</td>
      <td width="72">£ Total</td>
    </tr>
    <tr>
      <td>1</td>
      <td>Lifewriting Workshop</td>
      <td>£15</td>
      <td><input type="text" name="Number-of-Tickets" id="W1"></td>
      <td><input type="text" readonly="readonly" name="Total" id="W1"></td>
    </tr>
</table>

3 个答案:

答案 0 :(得分:0)

WORKING DEMO

只是一个简单的演示,没什么特别的。这是jquery,但我猜逻辑就是我们想要的。

$('input').on("keyup",function () {
    $("#result").val(parseInt($("#amount").val(), 10)*  15);
});

答案 1 :(得分:0)

使用javascript,您可以执行以下操作

 var text1 = document.getElementById('textbox1').value;
 document.getElementById('textbox2').value = parseInt(text1) * 15; //can use parseFloat() if you have floating point numbers

您输入数量的第一个文本框应该有一个名为id的{​​{1}}

textbox1

第二个文本框的ID应为<input type='text' id='textbox1' ... 。只要您将相应的ID放在javascript代码中以供参考,您就可以拥有自己喜欢的任何ID。

您还需要从textbox2事件或onkeydown事件调用的函数中触发此代码。在更改事件后,您将在输入数字后注意到更改,并将焦点从onchange调出来调用可以使用元素的事件属性触发它们的事件。

textbox

此解决方案使用纯JavaScript代码,MESSIAH的答案使用名为<input type='text' id='textbox1' onkeydown='somejavascriptfunc()` 的库,让您的生活更轻松。

答案 2 :(得分:0)

PHP是服务器端语言,因此为了进行一些计算,您需要向服务器发送请求。您可以通过创建所需的表单,将输入的值发送到服务器并再次生成页面但在结果填充的只读字段中在PHP中执行此操作。更好的方法是使用javascript,因为计算非常简单,并且不需要在服务器上运行它。搜索javascript事件监听器并查看jQuery,它具有易于使用的函数,用于从字段中检索值和处理事件。