Question

我正在使用mathiasbynens / jquery-placeholder，所有版本的浏览器都能正常运行，这对我来说非常重要，因为我们的大多数客户都使用IE7,8。

但是像往常一样，Internet Explorer存在问题。我有一个输入类型，正是它是被屏蔽的电话号码，当我被关闭时，该字段占位符的屏蔽出现在IE中，否则它不会出现。我如何解决它来处理具有掩码的元素。

这是代码：

 <input type="text" name="phone_number" id="phone_number_btd"  value="<?php echo $phone_number; ?>" placeholder="Phone Number"/>


$("#phone_number_btd").mask("(999) 999-9999? x9999");

及以下是调用占位符功能的代码：

     (jQuery)('[placeholder]').focus(function() {
        var input = $(this);
        if (input.val() == input.attr('placeholder')) {
          input.val('');
          input.removeClass('placeholder');
        }
      }).blur(function() {
        var input = $(this);
        if (input.val() == '' || input.val() == input.attr('placeholder')) {
          input.addClass('placeholder');
          input.val(input.attr('placeholder'));
        }
      }).blur();

Answer 1

以下脚本完全解决了我在“商务电话”中没有出现在MSIE 9到11中的问题。希望这会有所帮助。

Placeholders.js是HTML5占位符属性的JavaScript polyfill。它是轻量级的，具有零依赖性，几乎可以在任何你能想象的浏览器中运行。

https://jamesallardice.github.io/Placeholders.js/

    <script src="CHANGE-TO-PATH-AFTER-DOWNLOADED/placeholders.min.js"></script>

    <section>
    <label class="">
    <input type="tel" name="phone" id="phone" placeholder="Business Phone">
    </label>
    </section>


    <script type="text/javascript">
     $(function()
     {
      // Masking
         $("#phone").mask('(999) 999-9999', {placeholder:'X'});
      // $("#date").mask('99/99/9999', {placeholder:'X'});
      // $("#card").mask('9999-9999-9999-9999', {placeholder:'X'});
      // $("#serial").mask('***-***-***-***-***-***', {placeholder:'_'});
      // $("#tax").mask('99-9999999', {placeholder:'X'});
     });            
    </script>

HTML占位符不会出现在屏蔽输入类型上

1 个答案: