週末に質問に答えるためにコードを大量に書き、機能も大体実装できたのですが、構造が貧弱な気がしてあまり考えていませんでした。まったくきれいではありません コードをコピー コードは次のとおりです: ドキュメントのタイトル <br>テーブル{ <br>ボーダー間隔: 0; <br>} <br>td{ <br>高さ: 50px; <br>幅: 50px; <br>ボーダー間隔: 0; <br>} <br>.hidden{ <br>表示: なし; <br>} <br> hebing <br>var selectecdlog = []; <br>var resultLen = 0; <br>var resultBegin = 0; <br>var backColor = ['red','green','blue']; // 3 行と仮定します 1 - 赤 2 - 緑 3 - 青 <br>var resultColor =0; <br>$("td").mousedown(function() { <br>selectecdlog = []; <br>resultColor = backColor[$(this).parent().attr('id').substr(1 )-1]; <br>$('td').css('background-color', 'white'); <br>// tr タグの ID <br>//alert($(this).parent ().attr('id')); <br>//列番号を取得します。 <br>//alert($(this).index() 1);背景色', resultColor); <br>selectecdlog.push($(this).attr('id')) <br>//alert($(this).attr('id')); >$("td").mouseup(onMouseUp); <br>$("td").mouseover(onMouseOver) <br>}) <br>function onMouseUp(){ <br>/* イベントに基づいて動作する*/ <br>var len =resultLen= Math.abs(parseInt(selectecdlog[0].substr(selectecdlog[0].indexOf('c') 1)) - parseInt($(this).attr('id' ).substr(($(this).attr('id').indexOf('c')) 1))) 1; <br>var begin =resultBegin= parseInt(selectecdlog[0].substr(selectecdlog[0].indexOf('c') 1)) >parseInt($(this).attr('id').substr(( $(this).attr('id').indexOf('c')) 1)) ? parseInt($(this).attr('id').substr(($(this).attr('id').indexOf('c')) 1)):parseInt(selectecdlog[0].substr(selectecdlog [0].indexOf('c') 1)); <br>for(var i =0; i<resultlen>{ <br>selectecdlog.push(selectecdlog[0].substr(0,2) "c" (resultBegin i)); <br><br>} <br>selectecdlog.shift(); <br>$('#log').text(selectecdlog.toString()); <br><br>$("td").unbind('mouseover',onMouseOver); <br>$("td").unbind('mouseup',onMouseUp); <br>} <br>function onMouseOver (引数) { <br>var len =resultLen= Math.abs(parseInt(selectecdlog[0].substr(selectecdlog[0].indexOf('c') 1)) - parseInt ($(this).attr('id').substr(($(this).attr('id').indexOf('c')) 1))) 1; <br>var begin =resultBegin= parseInt(selectecdlog[0].substr(selectecdlog[0].indexOf('c') 1)) >parseInt($(this).attr('id').substr(( $(this).attr('id').indexOf('c')) 1)) ? parseInt($(this).attr('id').substr(($(this).attr('id').indexOf('c')) 1)):parseInt(selectecdlog[0].substr(selectecdlog [0].indexOf('c') 1)); <br>$('td').css('背景色', '白'); <br>for(var i =0; i<len>{ <br>$('#' selectecdlog[0].substr(0,2) "c" (begin i)).css( '背景色', resultColor); <br>} <br>//alert( $(this).attr('id').substr(($(this).attr('id').indexOf('c')) 1)); <br>//$('#' tdId).css('background-color', 'red'); <br>} <br>// 各 td の ID 属性を設定します <br>$("td").each(function(index, val){ <br>/* 配列またはオブジェクトを反復処理します */ <br>$ (this).attr('id', $(this).parent().attr('id') "c" ($(this).index() 1))}); <br>//セルを結合します <br>関数結合 (引数) { <br>// 本体... <br>for (selectecdlog の var m) <br>{ <br>if(m==0) <br>{ <br>$('#' selectecdlog[m]).attr('colspan', resultLen); <br>$('#' selectecdlog[m]).css('width',resultLen*50 "px"); <br>//$('#' selectecdlog[m]).css('background-color', 'bule'); <br>} <br>else{ <br>$('#' selectecdlog[m]).addClass('hidden'); <br>} <br>} <br>} <br>