Найти автоматическую ширину элемента с помощью jquery / js

Question

В IE, в Focus я потенциально хочу увеличить ширину элемента до width: auto только там, где автоматическая ширина больше, чем статическая ширина, которую я установил. Чего я стараюсь избегать, так это просто устанавливая элемент в width: auto и уменьшая его. Я хочу, чтобы он расширялся только там, где это необходимо.

У кого-нибудь есть чистый способ проверить, какой будет ширина элементов при установке на auto без необходимости сначала устанавливать атрибут? Прямо сейчас я установил его, затем проверил ширину и, возможно, установил статическое значение, похоже, должно быть более чистое решение.

Пример текущего кода с помощью jquery:

$('mySelector').live('focus', function() {
      //store the original width, then set the element to width: auto
      $(this).data('w', $(this).width()).css('width', 'auto'));
      //is the element now shorter?  if so, set it back to the original width
      if ($(this).width() < $(this).data('w')) {
         $(this).width($(this).data('w'));
      }
   }

Answer 1

Не уверен, что вы найдете более чистое решение, но вот то, которое не связано с манипулированием самим элементом:

function adjustWidth($el) {
    var $clone = $el.clone().css({width: "auto", display:"none"}).appendTo($el.parent());
    var width = $clone.width();
    $clone.remove();

    if (width > $el.width()) {
        $el.css("width", "auto");
    }
}