Question

canvas中画布自适应jquery语句的兼容性问题

为了使canvas根据窗口大小设置画布大小，使用以下Jquery语句：
$(canvas).attr("width",$(window).get(0).innerWidth);
$(canvas).attr("height",$(window).get(0).innerHeight);
但是canvas如果不在初始化标签<canvas>中给定width和height的话，就会获得一个默认值（360极速环境下为300px*150px）
那么问题来了，在之后使用上述两条语句时，会造成浏览器的处理方式的分歧。360极速环境下是不会拉伸画布的，但是我同学的谷歌浏览器拉伸了画布。
如何解决这个问题呢

• 你的回答被采纳后将获得：
• 系统奖励15（财富值+成长值）+难题奖励10（财富值+成长值）+提问者悬赏5（财富值+成长值）

Answer 1

你的语句就写错了$(canvas)少了引号。而且加上引号是所有canvas表签。

试试这样也可以：
$('canvas').width($(window).width());

追问

抱歉没解释清楚，前面有一句 var canvas = document.getElementById("canvas_id");

追答

.......你至于吗。
JQUERY就有获取ID的方法。直接$('#canvas')

我记得你这样写会有问题的，我以前试过

追问

对于一个dom对象，只需要用$()把dom对象包装起来，就可以获得一个jquery对象了，方法为$(dom对象)

追答

这个我知道啊，$(window).width()就是这样获取你窗口的宽度的啊。

你想问的是什么。你原来的问题是你用你写的那种方式在某些浏览器不实现。跟jquery获取对象没关系呀。
我说的是你用原生的getElementById获取的放在$()里面会有问题，以前我有测试过。

Answer 2

先获得浏览器窗口的大小 var width = $(window).width();
然后根据你所需要的比例来获得高度 var height = width*9/16 //这里用的是16：9的比例
然后再赋值，接下来就看你的了... ...

追问

这也是自适应啊。。。。那如何防止拉伸呢。。。。