IE9 Placeholder.js Bug

时间:2015-08-04 14:39:02

标签: javascript html5 internet-explorer-9 placeholder

我在IE9上使用placeholder.js作为我的HTML5属性'placeholder'。

我的问题是当页面最初加载时,输入字段仍然没有显示占位符。一旦我点击并聚焦在输入字段内部并重新聚焦就可以了。我有理解可能导致这种情况的问题。

我在页脚中加载placeholder.js

<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/angular-route/angular-route.js"></script>
<!--Third Party Dependencies-->
<script src="/bower_components/jquery/dist/jquery.min.js"></script>
<script src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="/js/libs/harvey.js"></script>
<script src="/js/libs/screen.js"></script>
<script src="/js/libs/placeholder.min.js"></script>
<!--Application Scripts-->
<script src="/js/app.js"></script>
<script src="/js/controllers/mainCtrl.js"></script>
<script src="/js/controllers/couponCtrl.js"></script>
<script src="/js/services/mobileDetection.js"></script>
<script src="/js/main.js"></script>

这是输入字段:

<input type="email" class="form-control email-address-input" name="userEmail" ng-model="email.text" placeholder="ENTER EMAIL ADDRESS" ng-class="{ 'error': emailForm.userEmail.$error.email }" required>

如果您有任何问题随时可以提出,任何反馈都会很棒。 谢谢,杰伊。

2 个答案:

答案 0 :(得分:1)

对于Internet Explorer 9,似乎将角度模型ng-model="email.text"插入到输入字段中。

$scope.toggleEmailClick = function(){
    $scope.coupon.showEmailForm = !$scope.coupon.showEmailForm;
    $scope.coupon.emailSent = false;
    $scope.email.text = "";
}

答案 1 :(得分:-2)

window.setTimeout(function () {
    Placeholders.enable();
}, 100);