javascript表就像表单操作一样

时间:2009-10-09 02:42:37

标签: javascript

基本上我在桌子上有一张表格。表格的每一行都有一些输入字段。

例如:

     col1  col2 
row1  A     C
row2  B     D

某些输入字段取决于其他字段。当我在A,B和C中输入内容时,D被锁定,其值由A,B和C的计算自动填充。

此外,用户可以按任何顺序在字段中输入值,并计算左边的值。

有没有人知道是否有jQuery / prototype插件可以做这样的事情?

1 个答案:

答案 0 :(得分:1)

你可以做几件简单的事情,而且他们不需要jQuery。首先,要“锁定”(禁用)字段D,您可以将disabled = "disabled"添加到HTML输入标记,如下所示:

<input type="text" id="D" disabled="disabled" />

这将使文本框可读,但不可编辑。我假设那是你试图完成的事情。

其次,关于A,B和C内容的自动计算,您可以将事件处理程序添加到输入标记,以便在事件发生时(例如按键盘键或将焦点移动到其他元素) ,你可以执行一个功能。

要做到这一点,首先在文档中声明一个Javascript函数,如下所示:

<script language="javascript">

function calculate() {
  document.getElementById('D').value = parseInt(document.getElementById('A')) + parseInt(document.getElementById('B')) + parseInt(document.getElementById('C'));
}

</script>

(这个过于简单化的函数假设所有输入分别具有'A','B','C'和'D'的ID。请注意,这也假设您只是尝试计算整数,并且此函数甚至没有尝试对用户输入进行健全性检查以确保文本字段具有预期值。还要注意,此功能未经测试。)

获得该功能后,可以使用Javascript事件处理程序将其添加到每个文本字段中。例如,如果您希望在用户点击输入框外部的内容时进行计算,请将onblur="calculate()"添加到输入标记,如下所示:

<input type="text" id="A" onblur="javascript:calculate()" />

您可以选择所需的相应事件处理程序。 For more on event handlers, click here