使用 jQuery Labelify 插件答案

【问题标题】：Using jQuery Labelify Plugin使用 jQuery Labelify 插件
【发布时间】：2011-03-12 06:54:28
【问题描述】：

这是 Labelify：http://www.kryogenix.org/code/browser/labelify/

基本上，它允许我将浅灰色文本放入我的文本框中，当它们被选中时会消失。

我只有两个问题：

我在具有此类标签的字段上使用 jQuery UI Datapicker，当我单击所需的日期时，该字段显示日期但仍为灰色（输入的文本应显示为黑色）。
对于有密码的字段，有没有办法让密码看起来仍然像 type=password 的输入，但让浅灰色标签显示为明文？当我尝试标记密码字段时，标签只是显示为以点为单位的标签长度，而不是纯文本。

谢谢！

【问题讨论】：

标签： jquery jquery-ui

【解决方案1】：

使用http://www.electrictoolbox.com/jquery-toggle-between-password-text-field/ 提供的指南而不是 Labelify。它也支持密码字段。不知道日期时间字段。
更新：查看以下链接。你有很多选择：
http://plugins.jquery.com/project/inlineFieldLabel
Label for password field

【讨论】：

【解决方案2】：

我知道这篇文章很旧，但我需要 Labelify 来做你提到的密码字段，所以我在 if (!lookupval) { return; } 代码部分之后添加了这段代码，应该在第 51 行。

  // Crob -- I added this to add the ability for Labilify to handle password fields.
  // This creates a separate text field that just shows the value of title from the password field
  // When focus is placed on the field it is hidden and the real field is shown.  When focus is lost
  // off the real field the text field is shown if there wasn't anything typed into the real field.
if ($(this).attr("type") === "password")
{
    var newField = $('<input>').attr('type', 'text').attr('value', lookup(this).replace(/\n/g, ''))
        .addClass("ui-input-text ui-body-c")
        .data('passwordField', $(this).attr('id'))
        .attr('id', 'PassHelper-' + $(this).attr('id'))
        .focus(function () { $("#" + $(this).data('passwordField')).show().focus(); $(this).hide(); });
    $(this).blur(function ()
    {
        if ($(this).val() == "")
        { $(this).hide(); $('#PassHelper-' + $(this).attr('id')).show(); }
    });
    $(this).after(newField);
    $(this).hide();
}

【讨论】：