回答編集履歴
1
バグ修正版ソースを追加
test
CHANGED
|
@@ -6,6 +6,8 @@
|
|
|
6
6
|
|
|
7
7
|
function switchColsAndRows(tabid){
|
|
8
8
|
|
|
9
|
+
// バグ放置版
|
|
10
|
+
|
|
9
11
|
var cols = [];
|
|
10
12
|
|
|
11
13
|
var rowIndex = 0;
|
|
@@ -96,6 +98,130 @@
|
|
|
96
98
|
|
|
97
99
|
}
|
|
98
100
|
|
|
99
|
-
|
|
100
|
-
|
|
101
101
|
```
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
追記：
|
|
106
|
+
|
|
107
|
+
上のソースは戒めとして放置。
|
|
108
|
+
|
|
109
|
+
・一つのtd/thタグにcolspan、rowspanの両方が設定されているときに表示が壊れるのを修正
|
|
110
|
+
|
|
111
|
+
・ CertaiNさんの指摘にあったrowspanのネスト時に表示が壊れるのを修正
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
```javascript
|
|
118
|
+
|
|
119
|
+
// たぶん完成版？？？
|
|
120
|
+
|
|
121
|
+
function switchColsAndRows(tabid){
|
|
122
|
+
|
|
123
|
+
var cols = [];
|
|
124
|
+
|
|
125
|
+
var rowIndex = 0;
|
|
126
|
+
|
|
127
|
+
var maxColSize = 0;
|
|
128
|
+
|
|
129
|
+
var tab = $('#' + tabid);
|
|
130
|
+
|
|
131
|
+
// consider colspan value first
|
|
132
|
+
|
|
133
|
+
tab.find('tr').each(function(){
|
|
134
|
+
|
|
135
|
+
if(!cols[rowIndex]){ cols[rowIndex] = []; }
|
|
136
|
+
|
|
137
|
+
var colIndex = 0;
|
|
138
|
+
|
|
139
|
+
$(this).find('td, th').each(function(){
|
|
140
|
+
|
|
141
|
+
var colspan = $(this).attr('colspan');
|
|
142
|
+
|
|
143
|
+
var colsize = (!colspan)?1:parseInt(colspan);
|
|
144
|
+
|
|
145
|
+
cols[rowIndex][colIndex] = $(this)[0];
|
|
146
|
+
|
|
147
|
+
for(var k = 1; k < colsize; k++){
|
|
148
|
+
|
|
149
|
+
cols[rowIndex][colIndex + k]={ omittable:true, rowspan:$(this).attr('rowspan')};
|
|
150
|
+
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
colIndex += colsize;
|
|
154
|
+
|
|
155
|
+
maxColSize = (cols[rowIndex].length > maxColSize)?cols[rowIndex].length:maxColSize;
|
|
156
|
+
|
|
157
|
+
});
|
|
158
|
+
|
|
159
|
+
rowIndex++;
|
|
160
|
+
|
|
161
|
+
});
|
|
162
|
+
|
|
163
|
+
// consider rowspan value next
|
|
164
|
+
|
|
165
|
+
for(var i = 0; i < cols.length; i++){
|
|
166
|
+
|
|
167
|
+
for(var j = 0; j < cols[i].length; j++){
|
|
168
|
+
|
|
169
|
+
var rowspan = $(cols[i][j]).attr('rowspan');
|
|
170
|
+
|
|
171
|
+
rowspan = (rowspan)?rowspan:cols[i][j].rowspan;
|
|
172
|
+
|
|
173
|
+
var rowsize = (!rowspan)?1:parseInt(rowspan);
|
|
174
|
+
|
|
175
|
+
for(var x = 1; x < rowsize && cols[i+x]; x++){
|
|
176
|
+
|
|
177
|
+
cols[i+x].splice(j, 0, { omittable : true, rowspan : 1});
|
|
178
|
+
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
tab.empty();
|
|
186
|
+
|
|
187
|
+
var initAttr = function(elm,name,val){$(elm).removeAttr(name);$(elm).attr(name, val);};
|
|
188
|
+
|
|
189
|
+
var replaceAttr = function(elm,name1,name2,v1,v2){
|
|
190
|
+
|
|
191
|
+
v1=$(elm).attr(name1);v2=$(elm).attr(name2);
|
|
192
|
+
|
|
193
|
+
initAttr(elm,name1,v2);initAttr(elm,name2,v1);
|
|
194
|
+
|
|
195
|
+
};
|
|
196
|
+
|
|
197
|
+
// rebuild table
|
|
198
|
+
|
|
199
|
+
for(var i = 0; i < maxColSize; i++){
|
|
200
|
+
|
|
201
|
+
var tr = $('<tr />');
|
|
202
|
+
|
|
203
|
+
for(var j = 0; j < cols.length; j++){
|
|
204
|
+
|
|
205
|
+
if(cols[j] && cols[j][i] && (!cols[j][i].omittable)){
|
|
206
|
+
|
|
207
|
+
var col = cols[j][i];
|
|
208
|
+
|
|
209
|
+
replaceAttr(col, 'rowspan', 'colspan');
|
|
210
|
+
|
|
211
|
+
tr.append(col);
|
|
212
|
+
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
tab.append(tr[0]);
|
|
218
|
+
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
```
|
|
226
|
+
|
|
227
|
+
|