我想使用jQuery在html中使用data-*属性将占位符设置为文本框？

Question

我想使用 data-* 属性设置占位符。我用 jQuery 试过。但不工作。如果我使用 id 而不是所有输入类型。它的工作。

但我想要通用代码来为页面中的任何输入文本字段设置占位符。

html：

<p>Login</p>
<input type="text" data-placeholder="Email" id="txtemail" />
<input type="password" data-placeholder="Password" id="txtpass" />

jQuery：

foctext = $('input:text').attr("data-placeholder");
$(this).val(foctext);
$(this).focus(function () {
    if ($(this).val() == foctext) {
        $(this).val("");
    }
});
$(this).blur(function () {
    if ($(this).val() == "") {
        $(this).val(foctext);
    }
});

请为此编写正确的解决方案。谢谢你

Answer 1

我想你可以使用 jQuery .data() 选择器 - 在这里阅读更多 - http://api.jquery.com/data/

$(document).ready(function(){
  $('input[type=text]').each(function(){
    var txt = $(this).data('placeholder');
    $(this).attr('placeholder', txt);
  });
});