Question

我想做什么...让我们说A是image1，B是image2，C是image3和 D是image4。我需要点击包含A的单元格和第二个单元格其他表会将背景更改为image1。单击包含D的单元格... 另一个表的第二个单元格中的背景将更改为image4。

<table><tr>
<td width="50" align="center">A</td>
<td width="20"></td>
<td width="50" align="center">B</td>
<td width="20"></td>
<td width="50" align="center">C</td>
<td width="20"></td>
<td width="50" align="center">D</td>
</tr></table>
<BR><BR>
<table><tr>
<td width="50" align="center">unchanged</td>
<td width="20"></td>
<td width="100" align="center">background color<br>changes when<br>A,B,C or D<br>
is clicked on.</td>
<td width="20"></td>
<td width="50" align="center">unchanged</td>
</tr></table>

感谢您的时间。

Answer 1

为每个表提供一个唯一的id，并使用jquery .click和.html方法来更改内容。

$("#table1 tr td#a").click(function() {
 $("#table2 tr td:nth-of-type(2)").html("<img something.. >");
});

Answer 2

基本上，您需要的是为“可点击”表格单元格分配一个javascript函数，该函数将使用“onclick”进行所需的更改。 “更改”表格单元格需要javascript的唯一ID才能轻松找到并影响它们。在最简单的形式中，javascript函数将驻留在<script>内的<head>标记内。尝试这样的事情：

<html>
   <head>
      <script type="text/javascript">
         function changeImage(id, image) {
            var ref = document.getElementById(id);
            ref.innerHTML = '<img src='+image+'>';
         }
      </script>
   </head>
   <body>
      <table border=1><tr>
         <td width="50" align="center"
            onclick="changeImage('myCell','image1.gif');">A</td>
         <td width="20"></td>
         <td width="50" align="center"
            onclick="changeImage('myCell','image2.gif');">B</td>
         <td width="20"></td>
         <td width="50" align="center"
            onclick="changeImage('myCell','image3.gif');">C</td>
         <td width="20"></td>
         <td width="50" align="center"
            onclick="changeImage('myCell','image4.gif');">D</td>
      </tr></table>
      <BR><BR>
      <table border=1><tr>
         <td width="50" align="center">unchanged</td>
         <td width="20" id="myCell"></td>
         <td width="100" align="center">background color<br>changes when<br>A,B,C or D<br>
         is clicked on.</td>
         <td width="20"></td>
         <td width="50" align="center">unchanged</td>
      </tr></table>
   </body>
</html>

我没有解决背景颜色，但我希望这会给你一个开始。：）

我需要通过单击另一个表中的某个单元格来更改表中一个单元格的背景。

2 个答案: