|
| カレッヂ |
質問者 難民
投稿日 2005/12/17(土) 20:32:01
初めまして、仕事で画面を作成することになったのですが、Java Scrptの 使用は初めてのため、以下の点でつまづいております。 環境はWindowsXP Pro、IE6.0です。 同一ＦＯＲＭ内に、２つのリストボックスを設置し、左側のリストボックスで 選択した項目(複数)を、ボタンを押下することにより右側のリストボックスに 移動させる、または右側から左側に移動させる方法を教えていただきたいです。 イメージとしては、Outlook Expressので、アドレス一覧から送信アドレスを 複数選択し、送信欄に設定する感じでしょうか？ 異なる点は、選択された項目が移動元のリストボックスからはなくなるところ です。 よろしくお願いします。
【習熟度】初めて |
回答者 m035
[削除]
投稿日 2006/1/6(金) 01:19:00
適当ですがサンプルを書いてみました。
<html>
<head>
<script type="text/javascript">
<!--
function move(a,b){
var f=document.forms[0];
if(f["sel"+a].length>0&&f["sel"+a].selectedIndex>-1&&f["sel"+a].options[f["sel"+a].selectedIndex].value.length>0){
var s=f["sel"+a].options[f["sel"+a].selectedIndex];
input(b,s.text,s.value);
f["sel"+b].size=f["sel"+b].length;
f["sel"+b].selectedIndex=0;
for(var i=0,j=0;i<f["sel"+a].length;i++){
s=f["sel"+a].options[i];
if(i!=f["sel"+a].selectedIndex){
f["sel"+a].options[j]=new Option(s.text,s.value);
j++;
}
}
f["sel"+a].length--;
f["sel"+a].selectedIndex=0;
}
}
function input(a,b,val){
var f=document.forms[0];
f["sel"+a].options[f["sel"+a].length]=new Option(b,val);
f["sel"+a].size=f["sel"+a].length;
}
//-->
</script>
</head>
<body>
<form>
<select name="sel1" size="0">
</select>
<select name="sel2" size="0">
</select><br>
<script type="text/javascript">
<!--
var v1=[["佐藤","satou@hoge.co.jp"],["鈴木","suzuki@hoge.com"],["伊藤","ito@hoge.ne.jp"]];
var v2=[["高橋","takahasi@hoge.com"],["山田","yamada@hoge.co.jp"]];
//["表示内容","データ(value)"]の形で書いてあり、アドが長すぎる場合に省略して表示することを考え、
//表示内容と実際にそのoptionの持つvalueを分けてみました。
for(var i=0;i<v1.length;i++)input(1,v1[i][0],v1[i][1]);
for(var i=0;i<v2.length;i++)input(2,v2[i][0],v2[i][1]);
//-->
</script>
<input type="button" value="→" onclick="move(1,2)">
<input type="button" value="←" onclick="move(2,1)">
</form>
</body>
</html> |
返信(回答)する
| Ｗｅｂ裏技 |