IE10 удаляет прописку на входе с правильным выравниванием

Я столкнулся с некоторой неопределенностью IE10 в отношении заполнения в выровненном справа поле ввода.

Проверьте этот скрипт http://jsfiddle.net/fhWhn/

::-ms-clear, ::-ms-clear{
    display: none;
}

Это удаляет "значки IE10", но что мне делать, если я хочу сохранить их и сохранить свои дополнения? Есть ли еще один, более умный способ сохранить отступы после onblur?

Ответ 1

Я столкнулся с этой проблемой. Чтобы получить отступы назад, просто установите значение текстового поля на размытие.

Мое простое решение:

$("input[type='text']").blur(function (evt){
    var $element = $(this);
    $element.val($element.val());
});

Ответ 2

Возможным обходным путем является использование стиля direction: rtl; на вашем входе, который перемещает × в левую часть элемента. Однако поведение использования справа налево может быть не идеальным для вашего случая.

Ответ 3

Edit: решение Eric работало для меня и было намного приятнее, но я оставляю этот ответ здесь, если какая-то будущая версия IE нуждается в другом исправлении.

Новый IE, новые проблемы рендеринга, связанные с IE...

Я отлаживал одно и то же поведение. Единственное, что я нашел, что работает до сих пор:

  • Удаление фокуса с входа (даже при явной настройке "padding-right" для элемента не влияет на фокус)
  • Установка значения padding-right на другое значение в правильное значение (установка его на правильное значение не приводит к изменению, по-видимому, потому, что система макета знает, что вычисляемое значение CSS не изменилось, поэтому решает, что повторная ничья не нужна)
  • Ожидание повторной розыгрыши (мгновенно - или даже после таймаута 1 или 2 миллисекунды - установка свойства снова на правильное значение не приводит к изменениям, по-видимому, из-за того, что повторная ничья не была выполнена согласно выше)
  • Установка свойства в правильное значение (например, с помощью $this.css("padding-right", ""), который удаляет любое значение для каждого элемента и позволяет вывести вычисляемое значение CSS).

Однако это, конечно, нежелательно, поскольку оно включает удаление фокуса с входа, когда пользователь может находиться в середине ввода.

Ответ 4

Ответ JustinStolle - лучший подход, я думаю.

Пример:

input[type="text"].field-al-right{
    text-align:right;
    direction:rtl;
}

Ответ 5

Вы пытаетесь добавить "размер окна" к вашему css?

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}