0

我有一个 JSfiddle 示例 http://jsfiddle.net/pAQTn/8/

我想要的是我的 div 与图像相邻，并且我希望文本在单击图像时出现我想要的另一件事是文本包含我从 1-4 中单击的哪个图像这是我的 HTML

<table border="1">
<tr>
  <td>
      <img onclick="imgclick()" src="http://a1.mzstatic.com/us/r1000/095/Purple/v4/f3/ac/2f/f3ac2f01-fa54-2dd6-09fc-5cee611d42db/mzl.cakizdof.100x100-75.jpg" alt="Pulpit rock" width="100" height="100" />
  </td>

  <td>
<img onclick="imgclick()" src="http://a1.mzstatic.com/us/r1000/095/Purple/v4/f3/ac/2f/f3ac2f01-fa54-2dd6-09fc-5cee611d42db/mzl.cakizdof.100x100-75.jpg" alt="Pulpit rock" width="100" height="100">
  </td>
</tr>
<tr>
  <td>
 <img onlick="imgclick()" src="http://a1.mzstatic.com/us/r1000/095/Purple/v4/f3/ac/2f/f3ac2f01-fa54-2dd6-09fc-5cee611d42db/mzl.cakizdof.100x100-75.jpg" alt="Pulpit rock" width="100" height="100">
  </td>
  <td>
 <img onclick="imgclick()" src="http://a1.mzstatic.com/us/r1000/095/Purple/v4/f3/ac/2f/f3ac2f01-fa54-2dd6-09fc-5cee611d42db/mzl.cakizdof.100x100-75.jpg" alt="Pulpit rock" width="100" height="100">
</td>
</tr>
</table>
<div id="txtarea">
    </div>

这是我的 CSS

img:hover{
     border:1px solid #0000ff;
    width:120px;
    height:120px;        
}

这是我的 JavaScript

function imgclick() {        
    txtarea.innerhtml="You clicked the baby no :";
}
4

2 回答 2

3

jsFiddle

尝试这个：

function imgclick(e) {
    src = (e.parentNode.parentNode.rowIndex * 2) + e.parentNode.cellIndex + 1;
    txtarea = document.getElementById('txtarea');
    txtarea.innerHTML = "You clicked the baby no :" + src;
}

我不确定你想在文本 no 上显示什么。在我的示例中，我将把onclick = "imgclick(this)"函数与您单击的图像连接起来。
在示例中，您从表格位置获取 img nr。

另请注意：在您的 html 中，第三张图片onlick应该是onclick

于 2013-07-05T08:14:16.970 回答
0

只需将数字放入: onclick="imgclick(1)",onclick="imgclick(2)"等。并将参数添加到您的函数中

function imgclick(num) {
    alert("hey");
    txtarea.innerHTML="You clicked the baby no "+num;
}
于 2013-07-05T08:56:57.620 回答