Question

我想在ajax inputTextArea或dblclick事件中捕获select中的所选文字。我该怎么做？下面的代码选择文本区域中的所有内容（我不想要）。非常感谢你。

<h:form id="form">          
        <p:panel header="Select Text">  
            <h:panelGrid columns="3" cellpadding="5">  
                <h:outputText value="Text: " />  
                <p:inputTextarea id="textarea" 
                            value="#{selectedTextBean.selectedText}">  
                    <p:ajax event="select" update="selectedText" />  
                </p:inputTextarea>  
                <h:outputText id="selectedText" 
                          value="#{selectedTextBean.selectedText}" />
            </h:panelGrid>  
        </p:panel>               
</h:form>

以下是SelectedTextBean

@ManagedBean
@ViewScoped
public class SelectedTextBean {

   public SelectedTextBean() {
   }
   private String selectedText;  

   public String getSelectedText() {
    return selectedText;
   }
   public void setSelectedText(String selectedText) {
    this.selectedText = selectedText;
   }
}

Answer 1

您可以使用此插件jquery-textrange。

的 XHTML 的

<p:inputTextarea onselect="setSelectedText()" /> <p:remoteCommand name="setSelectedTextCommand" actionListener="#{mainBean.setSelectedText()}" update="currentSelectedText" /> Selected Text is: <h:outputText value="#{mainBean.selectedTextInArea}" id="currentSelectedText" /> <h:outputScript library="js" name="jquery-textrange.js" /> <script> function setSelectedText() { var range = $('.ui-inputtextarea').textrange();// general selector setSelectedTextCommand([{name: 'selectedText', value: range.text}]); } </script>

的豆的

private String selectedTextInArea; public void setSelectedText() { FacesContext context = FacesContext.getCurrentInstance(); Map map = context.getExternalContext().getRequestParameterMap(); selectedTextInArea = (String) map.get("selectedText"); } public String getSelectedTextInArea() { return selectedTextInArea; } public void setSelectedTextInArea(String selectedTextInArea) { this.selectedTextInArea = selectedTextInArea; }

这是Primefaces TextArea Selection和demo上的实时github。

Answer 2

您可以按如下方式将参数发送到远程命令：

视图

<h:form id="form">          
    <p:panel header="Select Text">  
        <h:panelGrid columns="3" cellpadding="5">  
            <h:outputText value="Text: " />  
            <h:panelGroup>
                <p:inputTextarea id="textarea" 
                                 value="#{selectedTextBean.selectedText}" onselect="processSelection();" />
                <p:remoteCommand name="sendSelection" actionListener="#{selectedTextBean.onSelect}" update="selectedText" process="@this" />
            </h:panelGroup>
            <h:outputText id="selectedText" 
                          value="#{selectedTextBean.selectedText}" />
        </h:panelGrid>  
    </p:panel>               
</h:form>
<script>
    function processSelection() {
        var selectedText = (!!document.getSelection) ? document.getSelection() :
                (!!window.getSelection) ? window.getSelection() :
                document.selection.createRange().text;
        sendSelection([{name: 'selectedText', value: selectedText}]);
    }
</script>

请注意text selection会根据浏览器的不同而发生变化。

The Bean

import java.io.Serializable;
import java.util.Map;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.context.FacesContext;

@ManagedBean
@ViewScoped
public class SelectedTextBean implements Serializable {

    public SelectedTextBean() {
    }
    private String selectedText;

    public void onSelect() {
        FacesContext context = FacesContext.getCurrentInstance();
        Map map = context.getExternalContext().getRequestParameterMap();
        selectedText = (String) map.get("selectedText");
    }

    public String getSelectedText() {
        return selectedText;
    }

    public void setSelectedText(String selectedText) {
        this.selectedText = selectedText;
    }
}

从inputTextArea primefaces jsf捕获选定的文本

2 个答案: