Question

我有一个HTML表单，其中有两个字段：用户名和密码。

现在，我希望“用户名”和“密码”出现在字段中以指示用户要放入的内容。目前我使用value=选项分配这些内容，但是如果我提交表单， “用户名”和“密码”也被提交。

如果单击提交，是否有一种干净的方式如何使文本显示而不将其包含在提交中。

谢谢！ Krt_Malta

Answer 1

在HTML5中，提供了此功能，称为placeholder。否则，您通常使用Javascript库。

Answer 2

好的，这基本上就是我这样做的。我将标签放在字段中，然后当页面加载时，我使用.data（）以隐藏的方式存储标签。当表单被提交时，如果它包含与.data（）中相同的内容，那么我将其清除（或者如果您希望填充该字段，则可以禁止提交）

$(document).ready(function(){

    // this will make sure we always remember what the values were:
    $("form.myform input[type='text']").each(function(){
        // I like to add a class as well, so I can make the label text in a lighter color
        if ($(this).val().length > 0) {
            $(this).data('label', $(this).val()).addClass('label');
        }

    });

    // this will clear the text when the input receives focus:
    $("form.myform input[type='text']").focus(function(){
        if ($(this).data('label') == $(this).val()) {
            $(this).val('').removeClass('label');
        }
    });

    // this will make sure the fields don't get submitted like that, but won't stop 
    // the form from being submitted....
    $("form.myform").submit(function(){
        $(this).find("input[type='text']").each(function(){
        if ($(this).val() == $(this).data('label')) {
            $(this).val('');
        }
    });
});

我没有在浏览器中运行或测试过，但从理论上说这应该可行（我以前做过）

此外，如果用户没有编辑文本，我们就不会再次使用标签文本填充标签文本....

Answer 3

请不要将它包含在您提交表单的php / asp脚本中。

- 编辑 -

重新阅读你的问题。我认为你的意思是人们只是进入页面并点击提交，而默认值在那里，是吗？

如果您使用验证（javascript或php / asp）禁止为这些字段提交“用户名”和“密码”，则不会在不更改其中的值的情况下提交表单。

这是你的意思吗？

在HTML字段中显示文本而不提交文本

3 个答案: