javascript - 如何将对象传递给innerHTML (JavaScript) 中的函数？

Question

如何将对象传递给innerHTML 中的函数？

这是一个例子:

function clickme()
{
  var coord = {x:5, y:10};
  testimageih(coord);
}

function testimageih(coord)
{
  var html = "<img id=\"sam1\" border=\"0\" name=\"sam1\" src=\"sample.gif\" " +
             "onLoad=\"ImageOnLoad(" + coord + ");\"></img>";
  document.getElementById("content").innerHTML = html;

}

function ImageOnLoad(coord)
{
  if (coord) alert("Success"); 
  else alert("Fail");
}

我怎样才能传递这个对象，坐标？目前，我唯一的其他办法是传递 coord.x 和 coord.y，而不是对象。

谢谢。

Answer 1

最简单的方法是创建图像、附加事件处理程序并使用 DOM 方法插入元素。

function testimageih(coord)
{
  var img = document.createElement('img');
  img.id = 'sam1';
  img.border = 0;
  img.name = 'sam1';
  img.src = 'sample.gif';
  img.onload = function() {
    ImageOnLoad(coord);
  };

  document.getElementById('content').appendChild(img);    
}

请注意，这与上面的代码有一个区别:它不会删除 #content 中当前的任何元素。如果发生这种情况，您将必须单独进行删除。