感謝のプログラミング 10000時間

たどり着いた結果(さき)は、感謝でした。

ラジオボタンで選んだidや、textに入力した文字をAjaxで取得する。

スポンサーリンク

ことば

コードの直交性を維持するために使うことのできる技法。
・コードの結合度を最小化する
・グローバル・データを避ける
・類似機能のリファクタリングを行う
達人プログラマー―システム開発の職人から名匠への道

Ajaxの勉強

・入力したキーを取得するJavaScript

function getkchar(e) {
	var code;
	if(!e) var e = window.event;
	if(e.keyCode) {
		code = e.keyCode;
	} else if(e.which) {
		code = e.which;
	}
	if (code) {
		return String.fromCharCode(code);
	} else {
		return code;
	}
}

・inputに入力した文字を取得して、outputに表示する

<script type="text/javascript">
var kstr = "";
function check(e) {
	var kchar = getkchar(e);
	kstr += kchar;
	document.getElementById("output").innerHTML = kstr;
}

function initOnLoad() {
	var observer = document.getElementById("input");
	setListener(observer, "keyup", check);
	document.getElementById("input").focus();
}
setListener(window, "load", initOnLoad);
</script>

ラジオボタンで選択されたものをAjaxを使って表示するサンプル
・イベントが発生したノードのID値を取得するJavaScript

function getid(e) {
	var target;
	if (!e) {
		var e = window.event;
	} 
	if (e.srcElement) {
		target = e.srcElement.id;
		if (target.nodeType == 3) { //MicroSoft
			target = target.rapentNode;
		}
	} else if (e.target) {
		target = e.target.id;
	} else {
		target = false;
	}
	return target;
}

ラジオボタンに設定したidを取得して、結果を表示するHTML

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<title>ラジオボタンで選択したものを表示する</title>
<script type="text/javascript" src="js/functions.js"></script>
<script type="text/javascript">
function check(event) {
	var select = getid(event);
	if (select != "friends") {
		document.getElementById("result").innerHTML = "選択結果:" + select;
	}
}

function initOnLoad() {
	var observer = document.getElementById("friends");
	setListener(observer, "click", check);
}
setListener(window, "load", initOnLoad);
</script>
</head>
<body>
<h3>ラジオボタンで選んだ値の取得</h3>
<p id="friends">
	<input type="radio" name="friend" id="mizky" />mizky
	<input type="radio" name="friend" id="桑野" />桑野哲司
	<input type="radio" name="friend" id="吉田" />吉田勝利
	<input type="radio" name="friend" id="山田" />山田平
</p>
<hr />
<p id="result"></p>
</body>
</html>

読んだ本

Ajaxによる業務アプリケーション開発

Ajaxによる業務アプリケーション開発


この本は、「モダンJavaScript」の次にやる本として最強だと思う。

感謝のプログラミング

今回で感謝のプログラミングは【228時間目】
10000時間まで、あと【9772時間】