代码之家 › 专栏 › 技术社区 › Rojo

如何在jquery中使用getContext()。

jquery

Rojo · 技术社区 · 6 年前

我想用 getContext('2d'); 在jQuery中。我见过 this question , 但它似乎不起作用。可能是更新的,因为这个问题是在9年前被问到的。我在加 <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script> 在头上,但使用不同的 <script> 标签。以下是我的全部代码:

var c = $('.canvas');
var ctx = $(c)[0].getContext('2d');

window.onload = function() {
	$c.width(500);
	$c.height(250);
	$c.css({'background-color': '#e2e2e2', 'margin': '0 auto', 'display': 'block'});
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<canvas id='canvas'>You're browser does not support the requirements to play this game. Update your browser or use a different browser</canvas>

我正在使用谷歌,并通过F12检查控制台,它说-

未捕获的类型错误:无法读取未定义的属性“getContext”

感谢您的帮助!谢谢!

2 回复 | 直到 6 年前

Tyler Roper 6 年前

$(".canvas") 选择具有班 “画布”。您没有满足此选择器的任何元素,因为 <canvas> 没有 class 一点都没有。

你也可以用 $("#canvas") 通过选择 id 或 $("canvas") 按节点类型选择( <帆布> )
var c 已经是jquery对象-不需要重新包装它 $(...)
这只是你的预感 window.onload 但如果脚本不在 <body> 或它在 <head> 但不是包裹在 $(document).ready( ... ) ,代码将查找 <帆布> 元素存在之前。

$(document).ready(function() {              // Remove this line if your code is at the end of <body>
    var $c = $('#canvas');
    var ctx = $c.get(0).getContext('2d');
});                                         // Remove this line if your code is at the end of <body>

我变了 VaR C 到 var $c 和 [0] 到 .get(0) 严格基于个人喜好。

-1

Ponlawat Sitthiwet 6 年前

$(“画布”)[0].getContext('2d');

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

1 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前