2

我目前正在尝试让 jSignature（一个捕获签名的插件）在 twitter 引导模式中工作。由于某种原因，签名框正在缩小以适合模态框并使签名无法正常工作。这是一个 jsFiddle 供参考http://jsfiddle.net/someyoungideas/3B3jS/。

<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>

<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <p id="signature"></p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

谢谢

4

2 回答 2

11

这似乎对我有用！

$('#myModal').on('show.bs.modal', function (e) {    
  $("#signature").jSignature();
  $("#signature").resize();
});

在某些情况下，我需要在超时中包装 jSignature 初始化和调整大小，但我认为这主要取决于模态本身的样式。

于 2015-07-13T15:59:19.667 回答
2

jSignature 适合自己到div它被初始化的内部。换句话说，如果在初始化 jSignature 时， divwith idsignature被测量为 0x0，它就会被初始化。

当页面/窗口调整大小时，会导致div调整大小，jSignature 会重新调整其大小以再次适合 div。但是，此自动调整大小仅在窗口调整大小时才有效，而不是在窗口保持不变但div调整大小时。

现在，为什么这很重要？

当您初始化 jSignature 时，您会针对隐藏的div. 在这个阶段它的大小是0x0。

  • jSignature 允许您在选项对象中指定大小。- 简单但丑陋的解决方案

  • 您可以将硬尺寸（宽度和高度）设置为signature div. - 简单但丑陋的解决方案。

  • 您可以在变得可见并获得其大小后初始化 jSignature 。signature div- 建议的解决方案，因为这种方式 jSignature 将适合自己的模式。

过时的：http: //jsfiddle.net/3B3jS/6/

$("#myModal")
// .on('show', function() {
//     console.log('Modal will be shown');
// })
.on('shown', function() {
    // consider checking if the sig widget is already there and if not:
    $("#signature").jSignature()
})
// .on('hide', function() {
//     console.log('Modal will be hidden');
// })
// .on('hidden', function() {
//     console.log('Modal is hidden');
// })
于 2013-01-21T23:35:24.800 回答