gpt4 book ai didi

javascript - JSF2 Primefaces 输入键 keycode=13 不适用于 commandButton

转载 作者:行者123 更新时间:2023-11-28 02:05:19 25 4
gpt4 key购买 nike

真正的问题:我试图理解我找到的 JavaScript 片段和 Primefaces 命令按钮之间的交互。该 JavaScript 代码段被分配给 JSF h:form 标记的 onkeypress 属性。我的这段代码在我的某些页面上有效,但在其他页面上无效。当我试图去掉非必要的内容来问这个问题时,JavaScript 完全停止工作了。

似乎有些东西我不明白,因为这段代码不起作用。请注意,如果用户实际单击该按钮,代码就会起作用。我希望当他们按下 Enter 键时它就能工作。我已经尽可能地剥离了内容,并对风格指南进行了切除,以使其更短。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Tray Report</title>
<h:outputStylesheet library="css" name="postalreports.css" />
</h:head>
<h:body>
<h:form id="thisform" onkeypress="if (event.keyCode == 13) { document.getElementById('thisform:btn').click(); return false; }" >
<p:panel id="panel" header="Report For Days">
<p:messages id="messages" />
<p:inputText id ="days" value="#{trayBean.days}" >
</p:inputText>
</p:panel>
<p:commandButton id="btn" value="RUN" actionListener="#{trayBean.run}"/>
</h:form>
</h:body>
</html>
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class TrayBean implements Serializable {
private Integer days = 1;
public TrayBean() {}
public void run() {
System.out.println("do something here");
}
public Integer getDays() { return days; }
public void setDays(Integer days) { this.days = days; }
}

附注我也尝试过 if (event.keyCode == 13) { this.submit(); }

经过额外研究后添加:令我懊恼的是,我已经找到了一个 Primefaces 特定的解决方案,而我本应该早点找到的。事实证明,只需简单添加 p:focus 标记即可根本不需要 JavaScript。这是实际有效的 XHTML 文件。支持 bean 没有变化。

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">

<h:head>
<title>Tray Report</title>
</h:head>
<h:body>
<h:form id="thisform">
<p:focus/>
<p:panel id="panel" header="Report For Days">
<p:messages id="messages" />
<p:inputText id ="days" value="#{trayBean.days}" >
</p:inputText>
</p:panel>
<p:commandButton id="btn" value="RUN" actionListener="#{trayBean.run}"/>
</h:form>
</h:body>
</html>

这将使我能够完成对原始问题的分析(因为我在尚未工作的页面上有一个 p:focus 标记),我将单独发布该问题。

最佳答案

由于 PrimeFaces 基于 jQuery,因此您应该节省时间并使用 jQuery 来注册表单的关键处理程序。当然,您必须允许在支持它的元素上输入,并且不会触发(也不应该触发)表单提交。如果您禁止在文本区域按 ENTER 键,您将会极大地惹恼用户。

根据我的经验,按键是不够的,你还需要处理按键:

<script type="text/javascript">
$(document).ready(function () {
var handler = function(event){
if (event.which == 13) {
var el = event.target;
if (/textarea/i.test(el.tagName) || /button/i.test(el.tagName))
return true;
if (/input/i.test(el.tagName) && /file/i.test(el.type))
return true;
if (_handler)
setTimeout(_handler, 1);
event.stopPropagation();
return false;
}
return true;
};
$('form').keyup(handler).keypress(handler)
});
</script>

另请参阅此主题:How to prevent ENTER keypress to submit a web form?了解更多与primefaces无关的问题。

关于javascript - JSF2 Primefaces 输入键 keycode=13 不适用于 commandButton,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17865184/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com