0

我已经在 html 和 JavaScript 中编写了一些代码......我的查询是当我点击时<td>,无论与之关联的值是什么,都必须显示在相应的文本框中......在<td>我前面已经取了文本框...例如,我采用了 3 个<td>和 3 个文本框

       <script type="text/javascript">
       function click3(x) {
       x = document.getElementById("name").innerHTML
       var a = document.getElementById("txt"); 
       a.value = x; 
       }
       function click1(y) {
       y = document.getElementById("addr").innerHTML
       var b = document.getElementById("txt1");
       b.value = y;
       }
       function click2(z) {
       z = document.getElementById("email").innerHTML
       var c = document.getElementById("txt2");
       c.value = z;
         }
       </script>

这是我的 JavaScript 代码,我知道这不是处理此类问题的适当方法,因为它提供了静态方法来处理此问题,是否有人对此问题有更好的解决方案?在 JavaScript/jQuery 中

4

3 回答 3

1

据我了解您的问题,您可以尝试以下操作,假设您的 HTML 是这样构造的:

HTML 标记

<table id="mytable">
  <tr>
    <th>Name</th>
    <th>Address</th>
     <th>Email</th>
  </tr>
  <tr>
    <td class="name">Tom</td>
    <td class="addr">789</td>
    <td class="email">tom@dot.com</td>
  </tr>
  <tr>
    <td class="name">Dick</td>
    <td class="addr">456</td>
    <td class="email">dick@dot.com</td>
  </tr>
  <tr>
    <td class="name">Harry</td>
    <td class="addr">123</td>
    <td class="email">harry@dot.com</td>
  </tr>
</table>

<input id="txt1" type="text" />
<input id="txt2" type="text" />
<input id="txt3" type="text" />​

jQuery :

$(".name").click(function(){
   $("#txt1").val($(this).text());
   $("#txt2").val($(this).nextAll().eq(0).text());
   $("#txt3").val($(this).nextAll().eq(1).text());
});​

$(".addr").click(function(){
   $("#txt2").val($(this).text());
   $("#txt1").val($(this).prevAll().eq(0).text());
   $("#txt3").val($(this).nextAll().eq(0).text());
});

$(".email").click(function(){
   $("#txt3").val($(this).text());
   $("#txt2").val($(this).prevAll().eq(0).text());
   $("#txt1").val($(this).prevAll().eq(1).text());
});

演示:http: //jsfiddle.net/Z9weS/

于 2012-11-06T17:17:17.850 回答
1

如果 click1、click2 和 click3 应该是三个事件,那么您必须保留所有三个函数,您可以缩短为文本字段分配值的脚本代码。

<script type="text/javascript">
   function click3(x) {
      document.getElementById("txt").value = document.getElementById("name").innerHTML;
   }
   function click1(y) {
     document.getElementById("txt1").value = document.getElementById("addr").innerHTML;
   }
   function click2(z) {
     document.getElementById("txt2").value = document.getElementById("email").innerHTML; 
   }
   </script>

如果您有单击事件并像这样缩短分配代码,则可以创建一个函数,

function SomeClick(x) {
   document.getElementById("txt").value = document.getElementById("name").innerHTML;
   document.getElementById("txt1").value = document.getElementById("addr").innerHTML;
   document.getElementById("txt2").value = document.getElementById("email").innerHTML;    
 }
于 2012-11-06T16:59:59.000 回答
0

You can combine columns and rows. Per cell consisting id you give it th column title and

number of series it could be the index of the row combination of row and column gives the

address as per table cell by a specific event you can read the value of the id

Then you know to pull the cell value.

 $('tr')
        .click(function() {
        ROW = $(this)
            .attr('id');
        $('#display_Colume_Raw')
            .html(COLUME + ROW);

        $('#input' + COLUME + ROW)
            .show();
        STATUS = $("#input" + COLUME + ROW)
            .val();
    });
于 2012-11-06T17:28:01.707 回答