Question

<input type="text" value="useraname" />
<input type="password" value="password" />

我正在使用jQuery使内联标签在点击/焦点上消失。密码像往常一样显示公牛，但我想知道它是否可能以某种方式在密码字段中显示“密码”标签作为文本（而不是••••）？

编辑添加：我希望隐藏用户输入的密码！。

由于

Answer 1

有插件。例如，请参阅labelify

Answer 2

为什么那么长的剧本？这只是一个简单的任务，可以使用半行代码完成：

<input type='text' onclick="this.type='password',value=''" class='watever' value='password'..etc

欢呼

Answer 3

检查现场标签jQuery插件 http://fuelyourcoding.com/scripts/infield/

Answer 4

查看下面的代码。只需将addPassClear("Password")附加到您希望使用此功能的任何输入元素。

$(function() {
$.fn.addPassClear =
function(text)
{
  return $(this).each(
  function()
  {
    $(this).focus(function(event){$(this).passFocusize(text); $(this).select(); });
    $(this).blur(function(event){$(this).passBlurize(text); });
  });
}
$.fn.passFocusize =
function(text)
{
  return $(this).each(
  function()
  {
    if ($(this).val()==text && $(this).attr("type")=="text")
    {
      $(this).val("");
      this.type="password";
    }
  });
};
$.fn.passBlurize =
function(text)
{
  return $(this).each(
  function()
  {
    if ($(this).val()=="")
    {
      $(this).val(text);
      this.type="text";
    }
  });
};
};

Answer 5

如果您输入type =“textbox”，您将能够看到密码。

Answer 6

我认为您需要动态覆盖＆lt; input type =“text”＆gt;在密码字段的顶部执行此操作。

Answer 7

我的解决方案与Dan提供的内容很接近。

<script language="javascript" type="text/javascript">
    function SwapLabel(id, label, alttype) {
        $(id).focus(function () {
            if (this.value == label) {
                this.value = "";
                if (this.type == 'text' && label == 'Password') {
                    this.type = alttype;
                }
            }
        });
        $(id).blur(function () {
            if (this.value == "") {
                this.value = label;
                if (this.type == alttype && label == 'Password') {
                    this.type = 'text';
                }
            }
        });
    }
    $(document).ready(function () {
        SwapLabel('#UserName', 'Username', '');
        SwapLabel('#Password', 'Password', 'password');
    });
</script>

这里的另一种选择是省略“label”参数，只使用“title”值，这基本上就是labelify.js所做的。如果需要，您可以添加labelify中仅将这些事件处理程序应用于所有类型文本输入的部分。或者下载labelify并在需要时添加以下代码：

            if (this.type == 'text' && label == 'Password') {
                this.type = alttype;
            }

            if (this.type == 'text' && label == 'Password') {
                this.type = alttype;
            }

我的代码段标签化的唯一优势是它包含原始问题的答案：

我想知道是否有可能以某种方式在密码字段中将“密码”标签显示为文本（而不是••••）？

密码字段的标签

7 个答案: