0

私はhtmlとJavaScriptでいくつかのコードを実行しました...私のクエリは、クリックする<td>と、それに関連付けられた値が何であれ、対応するテキストボックスに表示する必要があります...前に<td>私はテキストボックスを取得しました...例として<td>、3つと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

クリック 1、クリック 2、クリック 3 が 3 つのイベントであると想定されている場合は、3 つの関数すべてを保持する必要があり、テキスト フィールドに値を割り当てるためのスクリプト コードを省略できます。

<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

列と行を組み合わせることができます。ID で構成されるセルごとに、列のタイトルを指定し、

シリーズの数 行と列の行の組み合わせのインデックスである可能性があります

IDの値を読み取ることができる特定のイベントによる表のセルごとのアドレス

次に、セル値をプルすることを知っています。

 $('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 に答える