-2

テーブルがあり、ユーザーがリンクをクリックすると、その行のコンテンツをコピーして、編集情報などの他のフィールドに入力する必要があります。行の内容を配列として設定するにはどうすればよいですか

<table id='mytable' border='1'>
    <thead>
        <th id='ID'>ID</th>
        <th id='Email'>Email</th>
    </thead>
    <tr>
        <td><a href="#">1</a></td>
        <td>abc@gmail.com</td>
    </tr>
    <tr>
        <td><a href="#">2</a></td>
        <td>xyz@gmail.com</td>
    </tr>
    <tr>
        <td><a href="#">3</a></td>
        <td>pqr@gmail.com</td>
    </tr>
</table>

jsfiddle リンク

http://jsfiddle.net/keJBZ/5/

4

2 に答える 2

3

あなたの質問は漠然としているので、なぜ私がこれに答えたのかわかりません。

選択した行から配列に情報を取得する場合は、次のように実行できます。

http://jsfiddle.net/KyleMuir/keJBZ/6/

var array = new Array();

$('#mytable tr').on('click', copyIntoArray);

function copyIntoArray() {
    var self = $(this);
    var tds = self.children('td');
    array.push(tds[0].innerText, tds[1].innerText);
}

配列にプッシュするオブジェクトを構築して、KVP などのコンテキストを提供できるようにすることは非常に理にかなっています。

編集

これが修正版です。配列は必要ありません。簡単に選択できるように、「メール」と「ユーザー名」の入力 ID も指定しました。

http://jsfiddle.net/KyleMuir/keJBZ/21/

最終的なコード:

$('#mytable tr').on('click', setInformation);

function setInformation() {
    $("#edit").show();
    var self = $(this);
    var tds = self.children('td');
    $('#username').val(tds[1].innerText);
    $('#email').val(tds[2].innerText);
}

最終編集?!? FireFox は .innerText をサポートしていないことが判明したため、それを jQuery に置き換えて値を取得しました。

http://jsfiddle.net/KyleMuir/keJBZ/24/

これ:

$('#username').val(tds[1].innerText);
$('#email').val(tds[2].innerText);

になります:

$('#username').val($(tds[1]).text());
$('#email').val($(tds[2]).text());

お役に立てれば。

于 2013-09-23T02:39:11.180 に答える
0

各行に ID を指定し、JavaScript で getElementById を使用してクリックされた行を取得します。次に、同じ関数を使用してその行のすべての列を取得することもできます。すべての列を変数に入れ、その変数を使用して必要なものを入力できます。

于 2013-09-23T02:39:34.587 に答える