3

webshims プラグイン キャンバス ポリフィルを動作させるのに問題があります。

IE7 モードを使用して IE9 で次のエラーが発生します。

  SCRIPT438: Object doesn't support property or method 'fillRect'
  problem.html, line 21 character 7

このコードを実行しようとすると:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
    <title>DealingTree</title>
    <meta http-equiv="Content-type" content="text/html;charset=utf-8"/>
    <script type="text/javascript" src="/js/modernizr.js"> </script>
    <script type="text/javascript" src="/js/jquery.js"> </script>
    <script type="text/javascript" src="/js/sssl.js"> </script>
    <script type="text/javascript" src="/js/webshims/js-webshim/minified/polyfiller.js"> </script>
  </head>
  <body>
    <canvas id="savings" height="350" width="700"> </canvas>
    <script type="text/javascript">
      //<![CDATA[
      window.FlashCanvasOptions = { disableContextMenu: true };
      $.webshims.setOptions( 'canvas', { type: 'flashpro' } );
      $.webshims.polyfill('canvas');
      var canvas = $('#savings');
      var context = canvas.getContext('2d');
      context.fillStyle='#F00';
      context.fillRect(0,0,700,350);
      //]>
    </script>
  </body>
</html>

デフォルト(excanvas)またはflashproのどちらを使用しても問題が発生します。

更新: getContext() がコンテキストではなく jQuery オブジェクトを返しているようです。

助けてください?

4

1 に答える 1

1

プラグインの作者である Alexander Farkas から次の説明をメールで受け取りました。

問題は次のとおりです。Webshims は、スクリプト ローダーを使用して非同期ポリフィルを行います。これは、最新のブラウザーでのパフォーマンスに適しています。これは、キャンバス機能の準備が整うまで待たなければならないことも意味します。

コードは domready イベントでラップする必要があり、すべて問題ありません。

window.FlashCanvasOptions = { disableContextMenu: true };
$.webshims.setOptions( 'canvas', { type: 'flashpro' } );
$.webshims.polyfill('canvas');
$(function(){
     var canvas = $('#savings');
     var context = canvas.getContext('2d');
     context.fillStyle='#F00';
     context.fillRect(0,0,700,350);
});

問題の詳細については、ドキュメント @ http://afarkas.github.com/webshim/demos/index.html#polyfill-readyを参照してください。

于 2011-05-26T03:37:54.767 に答える