2

我使用Webshim polyfill逐步引导用户完成表单的各个部分。日期输入在页面加载时隐藏style="display: none;"。它的宽度以百分比指定。Webshim 将页面加载时输入包装元素(显示而不是实际日期输入)的宽度设置为固定宽度。它不会在显示时更新包装元素的宽度$('#initiallyHidden').show();。但如果用户调整窗口大小,它会更新宽度。如何手动触发更新?是否可以在节目中自动触发更新?

webshim.activeLang('de');
webshims.setOptions('forms-ext', {
  replaceUI: true
});
webshims.polyfill();
webshims.cfg.no$Switch = true;

$('#showHiddenInput').click(function () {
  $('#initiallyHidden').show();
});
.full-width {
  width: 100%;
}  
<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/webshim/1.15.10/dev/polyfiller.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <form action="">
    <button id="showHiddenInput">show hidden input</button>
    <div id="initiallyHidden" style="display: none;">
      <input name="initiallyHidden" type="date" class="full-width" required>
      <label for="initiallyHidden">Input was initially hidden and should have full width (100%)</label>
    </div>
  </form>
</body>
</html>

4

0 回答 0