Google的html5 shiv不呈現佔位符？

我有一個表格，客戶需要輸入框中的標籤，我決定使用HTML 5的佔位符和Google的html5shiv，而不是舊的JavaScript。然而，我的佔位符在IE中似乎不能正常工作，這正是我使用shiv的原因。下面是代碼：Google的html5 shiv不呈現佔位符？

文檔類型：

<!DOCTYPE html>

希夫：

<!--[if IE]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script> 
<![endif]-->

形式：

<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>

任何想法，爲什麼它不工作？

修訂：

使用代碼提示在下面的評論，我已經改變了我的代碼以下，但它仍然沒有工作。

腳本包括（該腳本的內容物直接從here複製）：

<script type="text/javascript" src="scripts/placeholders.js" charset="utf-8"></script>

DOM就緒事件偵聽器：

<body onload="Placeholders.init(true);">

來源

2012-02-14 Phil Young

[代碼]（https://github.com/aFarkas/html5shiv/tree/master/src）中似乎沒有任何對佔位符屬性的引用。 html5shiv實際上是否應該填補它們？ – pimvdb 2012-02-14 12:53:17

據我所知html5shiv不會爲'placeholder'屬性做任何事情。雖然有各種各樣的墊片（主要是jQuery）...查看[Modernizr]（https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills）列表或[我自己的嘗試] （https://github.com/jamesallardice/Placeholders.js）（不需要jQuery） – 2012-02-14 12:53:39

@JamesAllardice我試過了你的代碼，但它不工作。請參閱修訂版 – 2012-02-14 13:25:58

的HTML5希夫簡單地使造型用於IE先前未知的元素。最新版本會做一些額外的事情，比如修補document.createElement，但除此之外它不會填充任何內容。

如果您想效仿placeholder，請使用佔位符polyfill。我已經寫了一個在jQuery插件格式，如果你有興趣：

$('input, textarea').placeholder();

這裏有一個演示：http://mths.be/placeholder

如下使用它http://mathiasbynens.be/demo/placeholder

順便說一句，你應該用<label>代替@placeholder如果文本是「您的全名」等。

來源

2012-02-14 13:32:07

我遇到了一個問題，使用asp：TextBox與此腳本。該控件有一個綁定到它的asp RequiredValidator控件，它無法捕獲任何值，導致回發。刪除佔位符插件修復了這個問題。任何解決方案 – 2014-01-17 16:04:44

@Mathias好的插件佔位符！謝謝！ – lizardhr 2014-08-07 20:25:12

查看Todd Northrop的jquery.watermark NuGet軟件包。

//polyfill placeholder in older browsers 
var inputs = $('input, textarea'); 

$.each(inputs, function (i, itm) { 
    var input = $(itm); 
    input.watermark(input.attr('placeholder')); 
});

我比較這兩種方法提供，且水印似乎應付密碼輸入好，但它不是很容易設置水印。

來源

2014-02-18 10:25:18

Google的html5 shiv不呈現佔位符？

回答

相關問題