Phi*_*ung 4 javascript forms html5 placeholder
我有一个表单,客户想要输入框内的标签,我决定使用HTML 5的占位符和Google的html5shiv,而不是旧的javascript.但是,我的占位符似乎在IE中没有正常工作,这就是我使用shiv的原因.这是代码:
文档类型:
<!DOCTYPE html>
Run Code Online (Sandbox Code Playgroud)
希夫:
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
<![endif]-->
Run Code Online (Sandbox Code Playgroud)
形成:
<form method="post" enctype="multipart/form-data" name="contactForm" id="contactForm">
<input type="text" name="name" id="name" placeholder="Your Full Name..." />
<input type="text" name="telephone" id="telephone" placeholder="Your Telephone Number..." />
<input type="email" name="email" id="email" placeholder="Your Email Address..." />
<textarea name="enquiry" id="enquiry" placeholder="Your Enquiry or Comments..."></textarea>
<p class="midpadLeft green_Button_margin_2"><span class="green_Button_2"><a href="javascript: document.contactForm.submit();" target="_self" class="green_Button_2">Submit Enquiry <img src="images/mid-envelope.png" alt="Submit"/></a></span></p>
</form>
Run Code Online (Sandbox Code Playgroud)
关于它为什么不起作用的任何想法?
修订:
使用下面评论中建议的代码,我已将我的代码更改为以下内容,但它仍然无效.
脚本包括(该脚本的内容直接从这里复制):
<script type="text/javascript" src="scripts/placeholders.js" charset="utf-8"></script>
Run Code Online (Sandbox Code Playgroud)
DOM就绪事件监听器:
<body onload="Placeholders.init(true);">
Run Code Online (Sandbox Code Playgroud)
Mat*_*ens 22
HTML5 Shiv只为IE中以前未知的元素启用样式.最新版本会做一些额外的事情,比如修补document.createElement,但除此之外它不会填充任何东西.
如果要模拟placeholder,请使用占位符polyfill.如果您有兴趣,我已经用jQuery插件格式编写了一个:http://mths.be/placeholder
使用方法如下:
$('input, textarea').placeholder();
Run Code Online (Sandbox Code Playgroud)
这是一个演示:http://mathiasbynens.be/demo/placeholder
顺便说一句,你应该使用<label>而不是@placeholder文字是"你的全名"等.