占位符插件 - 表单提交时未清除值答案

【问题标题】：Placeholder Plugin - Values are not clearing on form submit占位符插件 - 表单提交时未清除值
【发布时间】：2014-02-22 01:50:26
【问题描述】：

除了在表单中提交的占位符值之外，我正在使用一个运行良好的占位符插件。我正在调用函数 clearVal() onclick，我觉得应该清除我所有的输入值等于占位符的值。因此，这些值不会在表单中提交。

这里是 JQuery：

function clearVal() {
var input = $("input[type=text]")
if ($(input).hasClass("placeholder")) {
    input.val("");
}
};
$(function() {
if(typeof document.createElement("input").placeholder == 'undefined') {
    $("[placeholder]").focus(function() {
        var input = $(this);
        if (input.val() == input.attr("placeholder")) {
            input.val("");
            input.removeClass("placeholder");
        }
    }).blur(function() {
        var input = $(this);
        if (input.val() == "" || input.val() == input.attr("placeholder")) {
            input.addClass("placeholder");
            input.val(input.attr("placeholder"));
        }
    }).blur();
}
});

提交按钮：

<button onclick="clearVal()" id="Submit_Form" type="submit" value="">Submit</button>

【问题讨论】：

标签： jquery jquery-plugins placeholder

【解决方案1】：

var input 是一个输入数组，当调用 hasClass 或 val 等函数时，它仅适用于列表中的第一项。

您应该循环遍历集合中的所有元素。

也可以在不触发按钮点击事件的情况下提交表单。你应该绑定到表单的提交事件

 <script>
  $("form").submit(function(e){
     var emptyInputs = $(this).find("input[type='text'].placeholder");
     emptyInputs.each(function(){
          $(this).val("");
      });
      return true;
 });
 </script>

【讨论】：