开发者

jquery-watermark plugin and HTML5 email input type not working correctly

开发者 https://www.devze.com 2023-01-14 08:10 出处:网络
diveintohtml5 says it\'s okay to start using the email form type. So I am trying it out on one of my forms. I\'m using jQuery and a plugin called jquery-watermark. It makes the placehold开发者_运维问答

diveintohtml5 says it's okay to start using the email form type. So I am trying it out on one of my forms. I'm using jQuery and a plugin called jquery-watermark. It makes the placehold开发者_运维问答er element work across browsers. The plugin still works on Firefox 3.6 but on Opera 10.61 and Chrome 6 the placeholder isn't rendered.

<script type="text/javascript">
  $('form input#comment_email').watermark('email (optional)');
</script>

is used to display the watermark/placeholder.

Rails 3 outputs this:

<input id="comment_email" name="comment[email]" size="30" type="email" /> 

I'm not sure why it's not working. Any ideas what's going on here?


It looks as though the jquery-watermark plugin only selects certain input types to watermark. All you should have to do is tweak this line in jquery.watermark.js:

selWatermarkAble = ":text,:password,:search,textarea",

to include the new email type:

selWatermarkAble = ":text,:password,:search,:email,textarea",


Did you mean the placeholder texts in inputs?
There is an alternative solution: HTML 5 Placeholders, and Watermark is a good fallback to browsers that do not support placeholders.

 $('input[placeholder]').each(function() {
   $(this).watermark($(this).attr('placeholder'));
 })

(note: I did not test that code!)

(EDIT: See also http://diveintohtml5.ep.io/detect.html#input-placeholder )

0

精彩评论

暂无评论...
验证码 换一张
取 消