I came to know that jquery supports all including old browsers
But I tried to add a placeholder for search box and it is not working in IE8
jQuery(document).ready(function(){
$('#search').attr('placeholder','search....');
});
So I want to know more about cross-browser supports. As said does it work actually or not?
I know the html attribute placeholder is not supported. But my question is about with jquery.
placeholder is an HTML5 feature which is not supported by IE8
use the following
<input type="text" value="search..." onfocus="if(this.value == 'search...') this.value = '';" onblur="if(this.value == '') this.value = 'search...';" />
using jquery
<input type="text" class="my-input" value="" />
<script type="text/javascript">
$(document).ready(function () {
$('.my-input').val('search...');
$('.my-input').focus(function () {
if (this.value == 'search...') this.value = '';
});
$('input.my-input').blur(function () {
if (this.value == '') this.value = 'search...'
});
});
/*
here I assumed a class
.my-input
you can use input#id or input.className or other selector
better you give the code of your text-box or entire form so that I can give you the exact selector
*/
</script>
As Above Placeholder is not supported.
So add the following code/comments to the head of your HTML page. And now ie8 will play nicely.
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<![endif]-->
IE8 dosen't support placeholders
only IE10+ supports to this attribute
But if you really want to have placeholders take a look at this jQuery plugin https://github.com/mathiasbynens/jquery-placeholder
The problem here is not JQuery but the placeholder attribute itself. See this chart for an answer to your question : No, IE8 does not support the placeholder attribute.
<label>element. The specification forbids that.