jquery - 输入模糊和窗口模糊

Question

所以我有这个 jsFiddle ( http://jsfiddle.net/KDAM8/ )，并试图弄清楚如何让输入在窗口模糊时保留它的值。当您专注于输入，然后 alt+tab 退出，或单击另一个屏幕，然后返回时，它不会保持正确的值。我不仅很难理解为什么会发生这种情况，而且我很难解释它。希望您能理解我对 jsFiddle 的要求。

<input type="text" value="name" />
<input type="password" value="password" />​

$('input').each(function() {
    var itemVal;
    $(this).focus(function() {
        itemVal = $(this).val();
        $(this).val('');
    });
    $(this).blur(function() {
        $(this).val(itemVal);
    });
});​

Answer 1

改进 gotuskar 的方法：如果将每个字段的初始值缓存在元素的.data中，则可以将其与 focus 和 blur 上的现有值进行比较以获得所需的效果：

$('input').each(function() {
    $(this).data('itemVal', $(this).val());

    $(this).focus(function() {
        if ($(this).val() === $(this).data('itemVal')) {
            $(this).val('');
        }
    });
    $(this).blur(function() {
        if (!$.trim($(this).val())) {
            $(this).val($(this).data('itemVal'));
        }
    });
});​

http://jsfiddle.net/mblase75/KDAM8/1/

Answer 2

调试并尝试了解我所做的更改 -

$('input').each(function() {
    var itemVal;
    $(this).focus(function() {
        itemVal = $(this).val();
        if (itemVal === 'name' || itemVal === 'password') // added
          $(this).val('');
    });
    $(this).blur(function() {
        itemVal = $(this).val(); // added
        if (itemVal !== 'name' || itemVal === 'password') // added
            $(this).val(itemVal);
    });
});​