1206637704 [JavaScript]

指定の行に指定の HTML を挿入し、指定の行を削除するスクリプトを探しています。
最終行に挿入し、最終行を削除するスクリプトはあるのですが、、、。

cloneNode,insertRow,deleteRow を使用して、指定の行を操作するスクリプトが希望です。
↑じゃなくてもいいです。よろしくお願い致します。

回答の条件
  • 1人50回まで
  • 登録:2008/03/28 02:08:27
  • 終了:2008/03/28 15:23:39

ベストアンサー

id:Mars No.1

Mars回答回数203ベストアンサー獲得回数202008/03/28 13:05:43

ポイント800pt

サンプルです。

http://c-man.s21.xrea.com/mars/q1206637704.html

・ヘッダ行に「+」ボタンがないと1行目の前に追加できないので

ヘッダ行もボタンになっています。

(ヘッダ行の「-」ボタンは無視)

・プログラムの都合上、一行は常に存在する仕様です。

(最後の1行を削除しようとすると内容(input)のクリアだけ行われる)


<html>
<head>
<title></title>
<script type="text/javascript">
if(window.addEventListener) {
	window.addEventListener('click',function(e){
		window.event = e;
		window.event.srcElement = e.target;
	},true);
}

function sample(){
	var bt = window.event.srcElement;
	if(bt.nodeName != 'INPUT') return;
	if(bt.parentNode.cellIndex>1) return;
	var tr = bt.parentNode.parentNode;
	var thF = (tr.parentNode.nodeName == 'THEAD');
	var tbod = (thF)?tr.parentNode.parentNode.tBodies[0]:tr.parentNode;
	if(bt.value == '-'){
		if(thF)return;
		if(tbod.rows.length<2){
			clrow(tbod.rows[0]);
			return;
		}
		tbod.deleteRow(tr.sectionRowIndex);
	} else {
		var rcopy = tbod.rows[0].cloneNode(true);
		clrow(rcopy);
		if(!thF && tr.sectionRowIndex+1==tbod.rows.length) {
			tbod.appendChild(rcopy);
		} else {
			tbod.insertBefore(rcopy,(thF)?tbod.rows[0]:tr.nextSibling);
		}
	}
}
// 行内の入力フィールドの初期化(現状 type="text"だけ)
function clrow(o){
	var inp = o.getElementsByTagName('input');
	for(var i=0;inp[i];i++){
		if(inp[i].type == 'text') {
			inp[i].value = inp[i].defaultValue;
		}
	}
}
</script>
</head>
<body>
<table onclick="sample()" border="1">
<thead>
<tr>
<th><input type="button" value="+"></th>
<th><input type="button" value="-"></th>
<th>値</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="button" value="+"></td>
<td><input type="button" value="-"></td>
<td><input type="text"></td>
</tr>
</tbody>
</table>
</body>
</html>
id:akame23

ありがとうございます!!!!!

カンペキです!!

"-"をクリックした時の引数にエレメントの ID を与え、、とかやっていて収拾がつかない状態でした。

大変勉強になりました。

ありがとうございました!m(__)mm(__)mm(__)m

2008/03/28 15:22:10

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません