我遇到一个问题,当用户在文本字段中输入文本时,动态显示和写入他/她留下的字符数的 JavaScript 不断将包含按钮/链接元素的包装器向下推一定数量的单位。我希望按钮包装器在 JavaScript 执行操作时保持固定而不移动。下面的屏幕截图说明了正在发生的情况。
之前
之后
关于如何防止这种情况的一般建议?
I have an issue where when the user inputs text into the textfield, the JavaScript that dynamically displays and writes how many chars he/she has left keeps pushing the wrapper that contains the button/links elements down a certain number of units. I want the button wrapper to stay fixed and not move when the JavaScript does it's thing. The screenshots below illustrate what is happening.
BEFORE
AFTER
Any general suggestions as to how you prevent this?
发布评论
评论(4)
我不知道如何在文本框下方添加文本,但您可以为元素指定初始
visibility
值隐藏
。它不会显示,但会占用空间。更新:
DEMO
你可能甚至不需要预先隐藏该元素。如果你给它一个固定的高度并且默认情况下它是空的,它也可以工作。
I don't know how you add the text below the textbox but you could give the element an initial
visibility
value ofhidden
. It won't be shown but it will occupy space.Update:
DEMO
You might not even need to hide the element beforehand. If you give it a fixed height and it is empty by default, it works as well.
将标签设置为
位置:绝对
。这将导致布局引擎忽略它占用的任何空间。
或者,您可以在不使用时将其设置为
可见性:隐藏
。这将导致它始终占据空间,即使隐藏时也是如此。
然后,您可以相应地调整布局以使其适合。
Set the label to
position: absolute
.This will cause the layout engine to ignore any space that it occupies.
Alternatively, you can set it to
visibility: hidden
when not in use.This will cause it to always occupy space, even when hidden.
You can then adjust your layout accordingly to make it fit.
将字符绝对放置在文本左侧。
Position the chars left text absolute.
我看到两种直接的方法:
为将包含消息的元素或包含字段和消息的元素指定固定大小,以便从一开始就有空间容纳消息。
对消息使用绝对定位,这样它就不会影响任何其他元素。
I see two straight forward ways of doing this:
Specify a fixed size for the element that will contain the message or the element containing the field and the message, so there is room for the message from the start.
Use absolute positioning for the message, so that it doesn't affect any other elements at all.