Question

function on_click(e)
{
  if( !e ) e = window.event;
   dragok = false;
   document.onmousemove = null;
   var x = e.target||e.srcElement;
  if( dx > 200 ) // dx is the numbers of pixels from leftside of mouse pointer
    {
      // document.write(dx); this is working it prints dx value but unable to create an image        
      var img = IEWIN ? new Image() : document.createElement('img');
      img.src="cool.jpg";
      document.getElementById(x.id).appendChild(img);
    }
 }

我在stackoverflow上找到了这些代码段，但在我尝试时却无法正常工作。这是What is the best JavaScript code to create an img element

目的是在调用函数on_click时创建图像（为onclick事件调用函数on_click）。 dx是从左侧测量的像素。因此，如果鼠标指针大于200像素，如果点击鼠标，它应该在那个地方创建一个图像，我的意思是如果dx是206，那么应该创建一个距离为206像素的图像。但我无法创建带有javascript的图像元素

我必须在javascript代码中进行哪些更改？

Answer 1

所有浏览器都需要这个：

var img = new Image();
img.src = "cool.jpg";
img.className = "myClass";
img.id = "mainImage";
x.appendChild(img);

如果您已经拥有DOM元素，则没有理由获取该ID，然后执行document.getElementById(x.id)。只需直接使用x。

要使用引用此图像的CSS规则，您可以制定这样的规则（取决于您是指类还是ID）：

.myClass {border: 1px solid #F00;}
#mainImage {padding: 14px;}

使用特定距离的javascript创建图像

1 个答案: