{"id":3790,"date":"2011-05-15T19:30:41","date_gmt":"2011-05-15T14:00:41","guid":{"rendered":"http:\/\/www.tothenew.com\/blog\/?p=3790"},"modified":"2011-05-16T10:20:06","modified_gmt":"2011-05-16T04:50:06","slug":"placeholder-in-html5","status":"publish","type":"post","link":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/","title":{"rendered":"Placeholder in html5"},"content":{"rendered":"<p>HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5  using an attribute. One of the example is placeholder attribute used with input type text which automatically puts the placeholder attribute value in the text field if it is empty. This placeholder text is cleared automatically on focus and on focus out either the entered text or the placeholder value (if nothing was entered) is displayed.<\/p>\n<p><strong>html form<\/strong><br \/>\n[groovy]<br \/>\n&lt;form&gt;<br \/>\n&lt;code&gt;<br \/>\n  &lt;input name=&quot;fieldname&quot; placeholder=&quot;Enter any keyword&quot;&gt;<br \/>\n  &lt;input type=&quot;submit&quot; value=&quot;Search&quot;&gt;<br \/>\n&lt;\/code&gt;<br \/>\n&lt;\/form&gt;<br \/>\n[\/groovy]<\/p>\n<p><strong>Support browser<\/strong><\/p>\n<table style=\"border-spacing: 1px;border-collapse: inherit;font-size: 12px;font-family: Arial,Helvetica,sans-serif,'Arial Rounded MT Bold'\" cellspacing=\"1\" cellpadding=\"4\" width=\"100%\" bgcolor=\"#cccccc\">\n<tbody>\n<tr>\n<td width=\"100\" bgcolor=\"#e6e6e6\"><strong>IE<\/strong><\/td>\n<td width=\"100\" bgcolor=\"#e6e6e6\"><strong> Firefox <\/strong><\/td>\n<td width=\"100\" bgcolor=\"#e6e6e6\"><strong>Safari <\/strong><\/td>\n<td width=\"100\" bgcolor=\"#e6e6e6\"><strong>Chrome<\/strong><\/td>\n<td width=\"100\" bgcolor=\"#e6e6e6\"><strong> Opera<\/strong><\/td>\n<\/tr>\n<tr>\n<td bgcolor=\"#ffffff\">.<\/td>\n<td bgcolor=\"#ffffff\">3.7+<\/td>\n<td bgcolor=\"#ffffff\">4.0+<\/td>\n<td bgcolor=\"#ffffff\">4.0+<\/td>\n<td bgcolor=\"#ffffff\">11.0+<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n","protected":false},"excerpt":{"rendered":"<p>HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts [&hellip;]<\/p>\n","protected":false},"author":23,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":3,"footnotes":""},"categories":[1],"tags":[378,575],"class_list":["post-3790","post","type-post","status-publish","format-standard","hentry","category-technology","tag-html5","tag-placeholder"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.0.1 - aioseo.com -->\n\t<meta name=\"description\" content=\"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Umar\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.0.1\" \/>\n\t\t<meta property=\"og:locale\" content=\"en_US\" \/>\n\t\t<meta property=\"og:site_name\" content=\"TO THE NEW BLOG\" \/>\n\t\t<meta property=\"og:type\" content=\"blog\" \/>\n\t\t<meta property=\"og:title\" content=\"Placeholder in html5 | TO THE NEW Blog\" \/>\n\t\t<meta property=\"og:description\" content=\"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary\" \/>\n\t\t<meta name=\"twitter:site\" content=\"@tothenew\" \/>\n\t\t<meta name=\"twitter:title\" content=\"Placeholder in html5 | TO THE NEW Blog\" \/>\n\t\t<meta name=\"twitter:description\" content=\"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts\" \/>\n\t\t<meta name=\"twitter:image\" content=\"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#article\",\"name\":\"Placeholder in html5 | TO THE NEW Blog\",\"headline\":\"Placeholder in html5\",\"author\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/author\\\/umar\\\/#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/#organization\"},\"datePublished\":\"2011-05-15T19:30:41+05:30\",\"dateModified\":\"2011-05-16T10:20:06+05:30\",\"inLanguage\":\"en-US\",\"commentCount\":1,\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#webpage\"},\"articleSection\":\"Technology, HTML5, placeholder\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.tothenew.com\\\/blog\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/category\\\/technology\\\/#listItem\",\"name\":\"Technology\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/category\\\/technology\\\/#listItem\",\"position\":2,\"name\":\"Technology\",\"item\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/category\\\/technology\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#listItem\",\"name\":\"Placeholder in html5\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#listItem\",\"position\":3,\"name\":\"Placeholder in html5\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/category\\\/technology\\\/#listItem\",\"name\":\"Technology\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/#organization\",\"name\":\"TO THE NEW Blog\",\"url\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/author\\\/umar\\\/#author\",\"url\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/author\\\/umar\\\/\",\"name\":\"Umar\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/1af3e1b09bea6a0bd4d1bbf4ff4a2fa0596c2ddbb67b3a28a8b8803738d855e7?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"Umar\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#webpage\",\"url\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/\",\"name\":\"Placeholder in html5 | TO THE NEW Blog\",\"description\":\"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/placeholder-in-html5\\\/#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/author\\\/umar\\\/#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/author\\\/umar\\\/#author\"},\"datePublished\":\"2011-05-15T19:30:41+05:30\",\"dateModified\":\"2011-05-16T10:20:06+05:30\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/\",\"name\":\"TO THE NEW Blog\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.tothenew.com\\\/blog\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"Placeholder in html5 | TO THE NEW Blog","description":"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts","canonical_url":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#article","name":"Placeholder in html5 | TO THE NEW Blog","headline":"Placeholder in html5","author":{"@id":"https:\/\/www.tothenew.com\/blog\/author\/umar\/#author"},"publisher":{"@id":"https:\/\/www.tothenew.com\/blog\/#organization"},"datePublished":"2011-05-15T19:30:41+05:30","dateModified":"2011-05-16T10:20:06+05:30","inLanguage":"en-US","commentCount":1,"mainEntityOfPage":{"@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#webpage"},"isPartOf":{"@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#webpage"},"articleSection":"Technology, HTML5, placeholder"},{"@type":"BreadcrumbList","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog#listItem","position":1,"name":"Home","item":"https:\/\/www.tothenew.com\/blog","nextItem":{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog\/category\/technology\/#listItem","name":"Technology"}},{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog\/category\/technology\/#listItem","position":2,"name":"Technology","item":"https:\/\/www.tothenew.com\/blog\/category\/technology\/","nextItem":{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#listItem","name":"Placeholder in html5"},"previousItem":{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#listItem","position":3,"name":"Placeholder in html5","previousItem":{"@type":"ListItem","@id":"https:\/\/www.tothenew.com\/blog\/category\/technology\/#listItem","name":"Technology"}}]},{"@type":"Organization","@id":"https:\/\/www.tothenew.com\/blog\/#organization","name":"TO THE NEW Blog","url":"https:\/\/www.tothenew.com\/blog\/"},{"@type":"Person","@id":"https:\/\/www.tothenew.com\/blog\/author\/umar\/#author","url":"https:\/\/www.tothenew.com\/blog\/author\/umar\/","name":"Umar","image":{"@type":"ImageObject","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/1af3e1b09bea6a0bd4d1bbf4ff4a2fa0596c2ddbb67b3a28a8b8803738d855e7?s=96&d=mm&r=g","width":96,"height":96,"caption":"Umar"}},{"@type":"WebPage","@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#webpage","url":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/","name":"Placeholder in html5 | TO THE NEW Blog","description":"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/www.tothenew.com\/blog\/#website"},"breadcrumb":{"@id":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/#breadcrumblist"},"author":{"@id":"https:\/\/www.tothenew.com\/blog\/author\/umar\/#author"},"creator":{"@id":"https:\/\/www.tothenew.com\/blog\/author\/umar\/#author"},"datePublished":"2011-05-15T19:30:41+05:30","dateModified":"2011-05-16T10:20:06+05:30"},{"@type":"WebSite","@id":"https:\/\/www.tothenew.com\/blog\/#website","url":"https:\/\/www.tothenew.com\/blog\/","name":"TO THE NEW Blog","inLanguage":"en-US","publisher":{"@id":"https:\/\/www.tothenew.com\/blog\/#organization"}}]},"og:locale":"en_US","og:site_name":"TO THE NEW BLOG","og:type":"blog","og:title":"Placeholder in html5 | TO THE NEW Blog","og:description":"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts","og:url":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/","og:image":"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png","og:image:secure_url":"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png","twitter:card":"summary","twitter:site":"@tothenew","twitter:title":"Placeholder in html5 | TO THE NEW Blog","twitter:description":"HTML5 has made the page designing an easy task. Placeholder is input field improvement in html5. Things that we were doing in past using combination of HTML and client side scripting language can be done in HTML5 using an attribute. One of the example is placeholder attribute used with input type text which automatically puts","twitter:image":"https:\/\/www.tothenew.com\/blog\/wp-content\/themes\/ttn\/images\/social-logo.png"},"aioseo_meta_data":{"post_id":"3790","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"Article","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"limit_modified_date":false,"created":"2021-04-30 08:14:01","updated":"2024-02-29 10:58:21","focus_keyword":null,"additional_keywords":null,"truseo_locale":null,"ai":null,"breadcrumb_settings":null,"seo_analyzer_scan_date":null},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/www.tothenew.com\/blog\" title=\"Home\">Home<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/www.tothenew.com\/blog\/category\/technology\/\" title=\"Technology\">Technology<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\tPlaceholder in html5\n\t\t<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/www.tothenew.com\/blog"},{"label":"Technology","link":"https:\/\/www.tothenew.com\/blog\/category\/technology\/"},{"label":"Placeholder in html5","link":"https:\/\/www.tothenew.com\/blog\/placeholder-in-html5\/"}],"_links":{"self":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/3790","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/users\/23"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/comments?post=3790"}],"version-history":[{"count":0,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/3790\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/media?parent=3790"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/categories?post=3790"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/tags?post=3790"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}