修改文本框宽度以显示xhtml素数面的所有数据

Question

我在表单中有只读文本框，可以自动填充表中的数据。

<p:inputText value="#{ManagedBean.var}" styleClass="textbox" id="varDetails" maxlength="200"></p:inputText>

某些条目没有完全显示，因为它们超过了文本框的宽度。如何使用Onmouseover命令动态更改文本框的宽度？

Answer 1

这似乎有效：

<h:form> 
    <p:inputText ... 
                 onmouseover="$(this).attr('size', this.value.length)"   
                 onmouseout="$(this).attr('size', '')" />
</h:form>

您必须在样式类中使用min-width，而不是width。

但如果内容比当前大小小，它也会变小。如果你不想这样，你可以使用之类的东西

onmouseover="if (this.value.length > 10) $(this).attr('size', this.value.length)"

应该选择值（上面的10），使其与styleclass中的最小宽度相匹配。

否则你可以给它一个标题：

<p:inputText ... value="#{ManagedBean.var}" title="#{ManagedBean.var}" />

这将在屏幕上显示。

你也可以给它一个p:tooltip:

<p:tooltip for="varDetails" value="#{ManagedBean.var}" />

这或多或少是一样的。