問題與jQuery和畫布元素

Question

這裏是我的代碼：

$('#add_shape').click(function() { 
          var rectHeight = $('#rect_height_input').val(); 
          var WidthOrRadius = $('#widthorradius').val(); 

          $('<canvas>').attr({ 
           id:'canvas'        
          }).css({ 
           height:function() { 
            if (rectHeight > 0) { 
             return rectHeight + 'px'; 
            } 
            else { 
             return WidthOrRadius + 'px'; 
            } 
           }, 
           width:WidthOrRadius + 'px' 
          }) 
          .appendTo('#work_area'); 
           var canvas = document.getElementById('canvas'); 
           var ctx = canvas.getContext('2d');        

           ctx.fillStyle = $('#color_list option:selected').val(); 
           ctx.fillRect(0, 0 , WidthOrRadius, rectHeight); 

}); 

此代碼上的jsfiddle（這裏：http://jsfiddle.net/dzejkej/xwg5f/），但不是在我的瀏覽器。我不知道什麼是錯的。有人可以幫忙嗎？

Answer 1

如果您在HTML5中編寫了代碼，這將給出正確的結果。

您確定您使用的是HTML5編碼？