如何找到用单选按钮选择的一个 tr 的值并将该数据附加到另一个 html？

Question

I am working with 2 forms.with first form I am having some dynamic data in html table.

<table id="main"><tr>
        <td><input type="radio" id="1"></td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr><tr>
        <td><input type="radio" id="2"></td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
    </tr><tr>
        <td><input type="radio" id="3"></td>
        <td>10</td>
        <td>11</td>
        <td>12</td>
    </tr>
</table>

用户可以 select 一行带有单选按钮，然后他可以单击一个按钮。 onclick 按钮用户应该能够获取特定行的数据并附加到另一个 html table.

例如，如果用户将点击 id='2' 的第二行。然后他会点击按钮：

<input type="button id="acceptData">

$("#accpetData td").click(function() {
     // here I want data of second row.
     //and data to another table like `(.appenddata).html('<table><tr><td>6</td><td>7</td><td>8</td></tr></table>`
     });

如何在js中获取这种数据

Answer 1

你这样做是为了获得你的行的价值...作为一个例子，它需要清理。

取你的 oneString 变量值。并将其注入您的其他 html 元素。

    $('table#main').click(function(event){

        // Get the value of the element you have clicked
        var number = event.target.id;
        console.log(event.currentTarget.rows);
        var row = event.currentTarget.rows[number].innerText;

        // Use JavaScript object method to grab value
        var extractValues = Object.values(row);
        console.log(Object.values(row));
        console.log('extractValues', extractValues);

        // Turn array of strings into one string. And remove commas
        var oneString = extractValues.join().replace(/,/g, '');
        console.log('oneString', oneString);

    });

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="app.js"></script>
    <title>title</title>
  </head>
  <body>

    <table id="main"><tr>
        <td><input type="radio" id="0"></td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr><tr>
        <td><input type="radio" id="1"></td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
    </tr><tr>
        <td><input type="radio" id="2"></td>
        <td>10</td>
        <td>11</td>
        <td>12</td>
    </tr>
</table>
  
  </body>
</html>

如何找到用单选按钮选择的一个 tr 的值并将该数据附加到另一个 html？

How to find values of one tr which is selected with radio button and append that data with another html?

html

javascript

jquery

append

radio-button