javascript ラジオボタンでDOMの開閉をしたい。


異なる配送先を選んだ場合には住所の入力欄が作られるスクリプト

<script>
window.onload = function() { /* チェックボックス */
var check = document.getElementById(“check”); /* 同じ住所 */
var non = document.getElementById(“non”); /* 違う住所 */
var frm = document.getElementById(“frm”); /* formのID */

//
non.checked = false;
non.value = ‘off’;

/* チェックボックスにonclickイベントハンドラをセット */

non.onclick = function() {
var hide_area = document.getElementById(“hide_area”);
check.checked = false; /* */
check.value = ‘off’;

if( non.value == ‘off’ ) {

hide_area1.innerText=”郵便番号:”;

var zipp = document.createElement(“input”);
zipp.type = “text”;
zipp.id = “zipp”;
zipp.name = ‘zipp’;
zipp.size = ‘4’;
zipp.maxLength = ‘3’;
hide_area1.appendChild(zipp);

var zipp2 = document.createElement(“input”);
zipp2.type = “text”;
zipp2.id = “zipp2″;
zipp2.name = ‘zipp2’;
zipp2.size = ‘5’;
zipp2.maxLength = ‘4’;
zipp2.onKeyUp=”AjaxZip3.zip2addr(‘zipp’,’zipp2′,’pref31′,’haisosaki’);”
hide_area1.appendChild(zipp2);
}
};

//上記と同じ住所 clicked
check.onclick = function() {
non.value = ‘off’;
hide_area.addClassName(“hide_class”);
};

</script>

書いているうちにもっと簡単な方法を思いついた。

display:none のクラスをあてたり、とったりすればいいのだ。

$(“hide_area”).removeClassName(“hide_class”); // 一行で片付いた。


Categories:

Tags: