2016-11-18 10 views
0

私はテーブルを持っていて、各行に、後でjQueryの行をクリックしたときに取得する必要のある属性を追加します。ここでjQuery htmlタグ属性からjsonオブジェクトを構築する方法

<tr>要素のサンプルです:

<tr data-id="1" data-employeeid="4" data-acceess="none" data-area="HR"> 
    <td class="sorting_1" tabindex="0">ID 01</td> 
    <td>This is a custom descriptiion</td>             
</tr> 

私はdata.*属性に基づいてjsonオブジェクトを構築したいだけでなく、列の値を追加します。

したがって、この例では、私はこのような何かを取得したいと思います:

{'employeeid':'4', 'access':'none', 'area':'HR', 'data1':'ID 01', 'data2':'This is a custom description'} 

任意の手掛かりを?

+0

を拡張することができ、それは、データaccess'など – adeneo

+0

'でなければなりません@アデネオ何を意味するのですか?あなたのフィードバックをお待ちしております。 – VAAA

+0

ハイフンのようにピリオドの付いた属性を使用しないで、データ属性を使用してください。 – adeneo

答えて

1

あなたが有効なデータを使用している場合は、あなたが必要とするすべてのオブジェクトとしてそれらのすべてを取得すること$(element).data()ある

<tr data-id="1" data-employeeid="4" data-acceess="none" data-area="HR"> 

属性。あなたにも、すべての子要素からテキストを追加したい場合は
、あなたはそのオブジェクト

完全に無効だ

var tr = $('tr[data-id="1"]'); 
 
var data = tr.data(); 
 

 
$.extend(data, $('td',tr).toArray().reduce(function(a,b,i) { 
 
\t a['data' + (i+1)] = $(b).text(); 
 
    return a; 
 
}, {})); 
 

 
console.log(data)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr data-id="1" data-employeeid="4" data-acceess="none" data-area="HR"> 
 
     <td class="sorting_1" tabindex="0">ID 01</td> 
 
     <td>This is a custom descriptiion</td> 
 
    </tr> 
 
</table>

+0

Iちょうど言うことができます:素晴らしい、ありがとう – VAAA

関連する問題