IE9 验证的占位符问题，jquery plugin/html

Question

我正在使用 jquery 插件在 IE9 上输入文本占位符，这给了我一个问题。

有一个页面，用户可以在其中 select 选择一个用户名或在文本字段中编写自定义用户名。这个插件在 IE9 上给这个输入文本添加一个 value 属性来模拟占位符。一切都很好，但是..

我收到验证错误，好像输入文本填写不正确，错误地填充了发送到表单的假占位符。如果在提交表单时使用 IE9，我正在尝试从输入中删除该属性，但是删除属性或使用 jquery 触发重置都有效。我尝试了一些东西，但没有运气..

如果值属性等于占位符的内容（'Type Username' 在这种情况下），我想清除或删除发送到表单的值，是否可以重置或删除发送前提交事件的输入值？

我试过这样的事情：

jQuery('button[type=submit]').on('click', function() {

    if (jQuery('#customUsername').val().indexOf('Type Username') >= 0 ) {
        jQuery('#customUsername').trigger('reset');
        jQuery('#customUsername').removeAttr('value');
        jQuery('#customUsername').removeAttr('placeholder');
    }

});

但它正在发送并收到验证错误...

非常感谢！

Answer 1

由于 <button type="submit"> 默认情况下会提交表单，您应该先通过 event.preventDefault() 删除默认行为，然后再执行您想要的操作。最后，您可以通过 .submit() 功能提交表单。示例代码如下：

$('button[type=submit]').click(function( event ) {
  event.preventDefault();
  if ($('#customUsername').val().indexOf('Type Username') >= 0 ) {
        $('#customUsername').trigger('reset');
        $('#customUsername').removeAttr('value');
        $('#customUsername').removeAttr('placeholder');
        $('#frm').submit();
    }
});

IE9 验证的占位符问题，jquery plugin/html

Placeholder issue on validation with IE9, jquery plugin/html

forms

validation

jquery

internet-explorer

placeholder