为什么我收到错误:Uncaught TypeError:无法读取未定义的属性“left”

时间:2014-04-24 15:29:55

标签: javascript jquery

HTML:

<div id="opening_0" style="background-color: #bfbfbf; position: absolute; left: 45px; top: 45px; height: 202.5px; width: 157.5px; overflow: hidden; z-index: 4;" ondrop="drop(event, this)" ondragover="allowDrop(event)" onclick="photos_add_selected_fid(this);">&nbsp;</div>

使用Javascript:

canvas.style.left = $("#opening_0").style.left - img.width + "px"; 
canvas.style.top = $("#opening_0").style.top - img.height + "px"; 

为什么我收到此错误“?

3 个答案:

答案 0 :(得分:2)

使用jQuery .css()函数,因为这基本上就是你使用jQuery的原因:

canvas.style.left = parseInt($("#opening_0").css('left')) - img.width + "px"; 

答案 1 :(得分:2)

错误是因为$("#opening_0")返回一个包装匹配的DOM节点的jQuery对象。要访问底层DOM节点,您可以将其视为一个数组:例如$("#opening_0")[0]将起作用。

但是,这种方法不会很好用,因为style.left将返回一个字符串,该字符串可能有px或百分比值。您可以使用$("#opening_0").offset().left代替它,它将始终返回一个数值。

答案 2 :(得分:0)

jQuery对象没有style属性。

如果您想要访问它,请使用vanilla javascript方式:

document.getElementById("opening_0").style.left;

...或&#34;展开&#34;像这样的jQuery对象:

$("#opening_0")[0].style.left;

我建议使用第一种方法。只需记住使用parseInt()解析值。