PrimeFaces 輸入文本回車鍵

Question

JSF 2.0，PrimeFaces 5.3

您好，我開發了一個導航控件（使用 jquery），當您在表單的某些組件（輸入文本、自動完成等）中按下 Enter 鍵時，焦點會跳轉到下一個組件，因此您無需使用鼠標即可瀏覽。 我的一個組件是一個輸入文本區域，所以我需要用其他替換回車鍵來換行。 我已經研究並發現我可以使用下一個代碼來捕捉輸入文本區域中的回車鍵。

<p:inputText id="commentInput" rendered="#{foo.rendered}" 
value="#{foo.value}"
onkeypress="if (event.keyCode == 13) { onchange(); return false; }">
<f:ajax event="change" listener="#{foo.test}" />

那么我的問題是，是否可以使用其他組合鍵在輸入文本區域中產生換行符？ 也許Alt + Enter鍵或類似的。 此應用程序是其他桌面應用程序的端口，因此我需要復制該行為。

更新@DavidFlorez 提出的解決方案

onkeyup="if (event.ctrlKey && event.keyCode == 13) {this.value = this.value.slice(0, $(this).caret().begin)+'\n'+this.value.slice($(this).caret()‌​.begin);}"

當我開始在 inputTextarea 中寫入時，出現下一個錯誤：

參數列表后未捕獲的 SyntaxError: missing )

我檢查 ) 但我看到所有都關閉了。 我按CTRL + Enter鍵，但沒有任何反應。

Answer 1

使用@DavidFlorez 解決方案，我修改了代碼：

<p:inputTextarea id="input" immediate="#{cc.attrs.inmediate}" value="#{cc.attrs.bean[cc.attrs.property]}" 
                tabindex="#{groupOfControl.getNextIndex(cc)}" maxlength="#{cc.attrs.maxLength}" 
                disabled="#{cc.attrs.disabled}" binding="#{cc.attrs.binding}" onkeyup="keyOverTextArea(event, '#{cc.clientId}Var')" 
                required="#{cc.attrs.require}" styleClass="#{cc.attrs.styleClass}" 
           rows="#{cc.attrs.row}" cols="#{cc.attrs.cols}" autoResize="#{cc.attrs.autoResize}" widgetVar="#{cc.clientId}Var"
           style="width:#{cc.attrs.width}%;resize:none">
        <composite:insertChildren />      
     </p:inputTextarea>

onkeyup 屬性調用我編寫的 jquery 函數：

function keyOverTextArea(event, widgetVar){
    if(event.keyCode == 13 && event.ctrlKey){
        var component = $(document.getElementById(PF(widgetVar).id));
        component.val(component.val().slice(0, component.caret().begin)+'\n'+component.val().slice(component.caret().begin));
        return false;
    }

    if ((event.which == 9 && !event.shiftKey) || event.which == 13){
        var idNextComponent = findComponent.findIdNextComponent(PF(widgetVar).id, null, true);
        PrimeFaces.focus(idNextComponente);
    }
}