テキストボックスに文字列を入れたら自動でプルダウンを選択するには？

AJAXを利用して以下のようなことをしています。
１．郵便番号を入れたら自動で住所が表示される。
２．住所は県名と市町村名以下と分離している。
３．県名はプルダウン式で、市町村名はテキストボックスとする。

現在までのテストだと、両方ともテキストボックスの場合までは動作確認できたのですが、プルダウンにした場合のやり方わかりません。

<SELECT name="pref" id="pref">
<OPTION value="北海道">北海道</OPTION>
<OPTION value="青森県">青森県</OPTION>
・
・
</SELECT>
テキストボックスの場合は、
var add = xmlDoc.getElementsByTagName('ajaxadd').item(0).firstChild;
document.getElementById('add2').value = ajaxadd.data;
で取得できています。

ちょっとわかりにくい説明で申し訳ありませんが、よろしくお願いします。

No.1 ベストアンサー 回答者： bgbg 回答日時： 2007/05/17 13:25

リストのオプション値とajaxで取得した都道府県名を比較していけば良いだけの話です。

var list = document.form.pref; // 都道府県名プルダウンリストのコンテキスト取得
// リストの各オプションの値とajaxで取得した県名prefTextとを比較し、一致したらそのインデックスを選択状態にする
for(index = 0; index < list.length; index++){
var element = list.options[index];
if(element.value == prefText){
list.selectedIndex = index;
break;
}
}

この回答へのお礼

OPTIONの配列を取得するやり方が分かっていませんでした。
list.lengthでfor文を回して内容を比較すればよかったんですね。
非常に参考になりました。ありがとうございました。

お礼日時：2007/05/18 14:22

No.2 回答者： yambejp 回答日時： 2007/05/17 13:28

ajax処理はともかく、リストの値を選択するならこんなかんじ

<script language=javascript>
function changeFunc(str){
var pref=document.getElementById('pref');
for(var i=0;i<pref.options.length;i++){
if(pref.options[i].value==str){
pref.selectedIndex=i;
break;
}
}
}
</script>

<SELECT name="pref" id="pref">
<OPTION value="">都道府県</OPTION>
<OPTION value="北海道">北海道</OPTION>
<OPTION value="青森県">青森県</OPTION>
<OPTION value="東京都">東京都</OPTION>
<OPTION value="沖縄県">沖縄県</OPTION>
</SELECT>
<input type="button" value="東京都を選択" onClick="changeFunc('東京都')">

この回答へのお礼

こちらもソースコードまでつけていただいてありがとうございました。
無事解決することができました。

お礼日時：2007/05/18 14:26