Java 如何在不刷新的情况下更新页面中显示的值

我在JSF页面中有这3个字段

<h:inputText id="val1" value="#{managedBean.val1}"/> 
<h:inputText id="val2" value="#{managedBean.val2}"/> 
<h:outputText value="#{managedBean.result}"/>

我希望outputText元素在字段val1和val2中插入一些值时自动更改其值，而不刷新页面。 结果变量应该这样计算（它正在计算百分比）：（val1*val2）/100

你能帮我解决一些疑问吗

我知道要做到这一点，我需要javascript或AJAX之类的东西。你认为最好的方法是什么

我很想知道如何使用AJAX，你能给我一些提示吗

由于我需要字段的类型为String，我的验证应该如何实现

---

我是否可以避免在字段中键入非数字的字符（如果按下的键不是数字，则在输入字段中根本不显示）？

如果使用java，则获取JQuery。处理完代码并获得所需结果后，您可以抓取要放入的dom元素并执行如下操作：

$("#result").html(newData);

---

如果这是一个简单的计算，不需要服务器调用，那么您应该使用客户端javascript解决方案

---

但是，正如您喜欢使用Ajax所做的那样，现在开始

您可以使用

和

render

属性来使用AJAX实现这一点

<h:form> 
      <h:inputText value="#{managedBean.val1}" > 
         <f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/> 
      </h:inputText> 
      <h:inputText value="#{managedBean.val2}" > 
        <f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/> 
      </h:inputText> 

      <h:outputText id="result" value="#{managedBean.result}"/>
</h:form>

---

另请参见

---

我对web应用程序不太熟悉，但您是否研究过？

<h:form> 
      <h:inputText value="#{managedBean.val1}" > 
         <f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/> 
      </h:inputText> 
      <h:inputText value="#{managedBean.val2}" > 
        <f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/> 
      </h:inputText> 

      <h:outputText id="result" value="#{managedBean.result}"/>
</h:form>

@ManagedBean(name = "managedBean") 
public class Bean { 
   private String val1; // getter and setter 
   private String val2; // getter and setter 
   private String res; // getter and setter 
   ... 

   public void someThingToDoListener(AjaxBehaviorEvent event) { 
       //res = some processing
    }

}