如何设计用于库的XPages JS函数？

Question

创建XPages应用程序，用于替换填写简单Excel并将其邮寄给用户的用户。

首先，我在表单上有两个编辑框，Hours10和Hours20。

希望输入到Hours20的值也转到Hours10。

当我在Hours20编辑框的onChange事件中有此代码时

var hours20 = XSP.getElementById("#{id:Hours20}").value; 
XSP.getElementById("#{id:Hours10}").value = hours20; 

它的工作原理，Hours10编辑框的更新值为Hours20。

当我将代码移动到保存在客户端javascript库中的函数时：

function updateHours() {
  var hours20 = XSP.getElementById("#{id:Hours20}").value; 
  XSP.getElementById("#{id:Hours10}").value = hours20; 
}

并从Hours20编辑框的onChange事件中调用它：updateHours（）;

它不起作用。给我一个XSP对象上找不到对象的对象。

不确定为什么会出错 - 我的猜测是XSP已经不在范围内了？

任何想法或解决方法？

Answer 1

表达式语言（例如#{id:Hours20}）只能在组件属性的上下文中解释，例如字段的onChange事件代码。将代码移动到单独的库后，代码不再是组件的属性，它的代码可以在组件属性中引用。

与任何其他优秀函数一样，设计所有客户端JavaScript函数以接受可能对上下文敏感的任何内容作为参数。例如：

function updateHours(inputId, outputId) {
  var hours20 = XSP.getElementById(inputId).value; 
  XSP.getElementById(outputId).value = hours20; 
}

然后您的onChange事件可以引用此函数，但只传入上下文相关的信息：

updateHours("#{id:Hours20}", "#{id:Hours10}");

通过这种方式，您可以在脚本库中保留可重用的业务逻辑，这总是一件好事，但这些库中没有任何内容可以假设页面结构或服务器端变量。