1

我在使用输入顶部的水印文本定位跨度时遇到了麻烦。使用 GWT+uibinder 的代码如下所示：

http://jsfiddle.net/camposcarlos/dMzL4/

并转换成 html 看起来像这样：

http://jsfiddle.net/ajMWd/

而不是通过将跨度浮动到左侧来重叠输入字段的顶部：

|----------------------------------|
|                |------------||--||
|                |passwd      ||Go||
|                |------------||--||
|                                  |
|----------------------------------|

输入后我得到它

|----------------------------------|
|          |------------|      |--||
|          |            |passwd|Go||
|          |------------|      |--||
|                                  |
|----------------------------------|

或者如果我尝试将跨度相对于输入的宽度定位，则在下一行

|----------------------------------|
|                |------------||--||
|                |            ||Go||
|                |------------||--||
|                 passwd           |
|----------------------------------|

关于如何解决它的任何想法？提前致谢。

4

3 回答 3

0

我已经能够从这里使用一个很好的解决方案来解决它。诀窍是用相对位置样式标记容器，用绝对标记标记密码框及其跨度。它无需指定任何位置即可工作！（虽然我还没有尝试过使用 IE） http://jsfiddle.net/ajMWd/4/

于 2012-04-21T22:59:14.450 回答
0

如果您现在的问题是您想在密码框中显示默认文本，但密码默认文本不可读，您需要在用户输入数据之前将密码输入更改为普通文本输入。

然后，在您的 JavaScript 中，您可以使用焦点事件将其更改回密码类型的输入。

尝试这样的事情：

<head>
   <script type="text/javascript">
      function changeToPassword() {
         document.getElementById("passwordSpan")
            .innerHTML = "<input id=\"password\" name=\"password\" type=\"password\"/>";
         document.getElementById("passwd").focus();
      }
   </script>
</head>
<body>
   <form>
      <span id="passwordSpan">
         <input onfocus="return changeToPassword()" id="passwd" name="passwd" type="text" value="Type Password" />
      </span>
   </form>
</body>
于 2012-04-20T14:24:41.353 回答
0

检查这个小提琴，它使用绝对定位。 http://jsfiddle.net/ajMWd/1/

编辑只是另一个版本做同样的事情http://jsfiddle.net/ajMWd/2/

于 2012-04-19T23:30:09.450 回答