0

这应该会发生
如果用户单击两个输入框之一，则应删除默认值。当用户点击网页上的其他地方并且一个文本字段为空时，应该使用data-default特定元素属性的默认值填充它。

这会发生
当有人单击页面上的某个位置并且该字段为空时，该字段将填充正确的值，但是当有人再次单击该字段时，文本不会被删除。似乎$(document)点击事件正在阻止$(".login-input")点击事件，因为$(".login-input")没有$(document)点击事件就可以工作。

JSFiddle
这里提供了我的问题示例：JSFiddle

坦克你的帮助！

4

4 回答 4

2

当您单击输入时，脚本正在运行，但由于输入在文档中，因此单击输入也是单击文档。这两个函数都会运行，文档是最后一个。

这称为事件冒泡，您需要停止传播：

$(document).ready(function () {
    $(".login-input").click(function (e) {
        e.stopPropagation()
        $(this).val("");
    });
});

小提琴：http: //jsfiddle.net/kLQW9/3/

于 2013-07-08T18:03:53.643 回答
1

这根本不是你解决占位符的方式，你这样做：

$(document).ready(function () {
    $(".login-input").on({
        focus: function () {
            if (this.value == $(this).data('default')) this.value = '';
        },
        blur: function() {
            if (this.value == '') this.value = $(this).data('default');
        }
    });
});

小提琴

如果真正的旧浏览器不是问题，您最好使用 HTML5 占位符属性。

编辑：

如果您决定两者都做，请在应用 javascript 之前检查浏览器中对占位符的支持：

var i = document.createElement('input'),
hasPlaceholders = 'placeholder' in i;

if (!hasPlaceholders) {
    // place the code above here, the condition will 
    // fail if placeholders aren't supported
}
于 2013-07-08T18:07:11.483 回答
0

试试下面的代码

$(document).ready(function () {
    $(".login-input").click(function () {
        $(this).val("");

    });
});
$(document).ready(function () {

    $(".login-input").each(function () {
        if ($(this).val() === "") {
            $(this).val($(this).attr("data-default"));
        }
    });
    $(".login-input").blur(function () {
        if ($(this).val() === "") {
            $(this).val($(this).attr("data-default"));
        }
    });

});

检查小提琴

于 2013-07-08T18:09:22.453 回答
0

为什么不使用焦点和模糊事件？

$(document).ready(function () {
    $(".login-input").focus(function () {
        $(this).val("");
    });
});
$(document).ready(function () {    
    $(".login-input").blur(function () {
        if ($(this).val() === "") {
            $(this).val($(this).attr("data-default"));
        }
    });    
});

http://jsfiddle.net/kLQW9/5/

PS在你的和这段代码中，所有来自输入的数据都将被清除。如果您只需要清除默认文本，请为此添加适当的条件。

于 2013-07-08T18:09:40.057 回答