XML+FSO+JS を使用してサーバー側のファイル選択効果を実現する

著者：Eve Cole 更新時間：2025-01-16 09:24:01

XML+FSO+JS を使用して、サーバー側のファイル選択効果のコードを実装します。必要な場合は、それを参照してください。

陳林章著、2003-4-20

' 転載する場合は出典を示し、この著作権情報を保持してください

response.write <?xml version=1.0coding=GB2312?>&chr(13)

response.write <メディアファイル>&chr(13)

フォルダ=リクエスト(フォルダ)

if フォルダー=/then

フォルダ=

終了する場合

ディムカウント

カウント=0

フォルダー=置換(フォルダー,..,)

basefolder=../media/'ベースフォルダーのパス

newfolder=ベースフォルダ&フォルダ

fso =server.CreateObject(Scripting.FileSystemObject) を設定します。

set f=fso.getfolder(server.mappath(newfolder))

sf=f.subfolders を設定します

sf 内の各 fd について、指定されたパスの下にあるフォルダーのリストを返します

response.write <ファイル>&chr(13)

response.write <ftype>フォルダ</ftype>&chr(13)

response.write <fname>&fd.name&</fname>&chr(13)

応答.write </file>&chr(13)

カウント=カウント+1

次

sf=何も設定しない

ff=f.ファイルを設定します

ff の各 fi に対して

fname=fi.name

if instr(asf,wma,wmv,lcase(mid(fname,instrrev(fname,.)+1)))>0 then'ソースコードの漏洩を防ぐために、返されるファイルの種類を設定します

response.write <ファイル>&chr(13)

response.write <ftype>ファイル</ftype>&chr(13)

response.write <fname>&fname&</fname>&chr(13)

応答.write </file>&chr(13)

カウント=カウント+1

終了する場合

次

'ディレクトリにファイルがない場合は、空の要素を送信します

count=0 の場合

response.write <ファイル>&chr(13)

response.write <ftype>empty</ftype>&chr(13)

response.write <fname>0</fname>&chr(13)

応答.write </file>&chr(13)

終了する場合

応答.write </メディアファイル>

ff=何も設定しない

f=何も設定しない

fso=何も設定しない

以下はクライアントJS（selectfile.asp）の動作です。

<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 移行版//EN>

<HTML>

<頭>

<TITLE> ビデオファイルを選択してください</TITLE>

<スタイル>

td{font-size:9pt}

選択{幅:210}

.s2{幅:250}

</スタイル>

<スクリプト言語=JavaScript>

<!--

/*陳林章著、2003-4-20

転載する場合は出典を明記し、この著作権情報を保持してください*/

//画像をプリロードする

var imgback = 新しい画像();

imgback.src = 画像/arrow.gif;

var imgbackgray = 新しい画像();

imgbackgray.src = 画像/grayarrow.gif;

var imgfolder = 新しい画像();

imgfolder.src = 画像/folder.gif;

var imggrayfolder = 新しい画像();

imggrayfolder.src = 画像/grayfolder.gif;

//履歴配列スタック

var arrhistory=新しい配列();

ヴァルヒシ=0;

// 返されるファイル名を決定するために使用されます

関数チェック()

{

if (document.all.filename.value==)

{

アラート(最初にファイルを選択してください);

false を返します。

}

それ以外

{

window.returnValue =document.f1.folder.value+document.all.filename.value;

window.close();

}

//XMLファイルの内容を取得する

関数 getuserlist(url)

{ var oXMLDoc = 新しい ActiveXObject('MSXML');

oXMLDoc.url = URL;

var ooRoot=oXMLDoc.root;

ooRoot を返します。

}

// ファイルが選択されている場合、この値をテキストボックスに返します

関数追加ファイル(txt)

{

document.all.filename.value=txt;

}

var first=1;//グローバル変数を定義する

function userlist(folders,ti)//選択されたボックスのリストを表示します

{document.f1.folder.value=フォルダー;

filebox.document.body.innerHTML=ファイルを読み込んでいます。お待ちください...;

var strshow=;

var timeoutid=null;

var newfolder=;

var arrfolder=新しい配列();

var arrff=新しい配列();

var ブランクstr=;

var oItem;

//履歴ステータスを決定する

ヒシ+=ティ;

arrhistory[hisi]=フォルダー;

if (ヒシ==0)

{

arrow.innerHTML=<img src=/images/grayarrow.gif/>;

}

それ以外

{

arrow.innerHTML=<img src=/images/arrow.gif/ border=0 style=/cursor:hand/ onclick=/userlist('+arrhistory[hisi-1]+',-1)/ onmouseover=/this。 src='images/arrow_over.gif'/ onmouseout=/this.src='images/arrow.gif'/>;

}

// 現在のフォルダーを決定する

if (document.f1.folder.value==)

{

folderid.innerHTML=<img src=/images/grayfolder.gif/>

}

それ以外

{ニュースフォルダー=チェックフォルダー(ドキュメント.f1.フォルダー.値)

folderid.innerHTML=<img src=/images/folder.gif/ border=0 style=/cursor:hand/ onclick=/userlist('+newsfolder+',1)/ onmouseover=/this.src='images/folder_over. gif'/ onmouseout=/this.src='images/folder.gif'/>

}

//ドロップダウンボックスに値を割り当てます

document.all.select.options.length=0;

新しいフォルダー=フォルダー;

フォルダ文字列=

var _obj=document.all.select;

var _o=document.createElement(オプション);

_o.text=フォルダーを選択;

_o.value=;

_obj.add(_o);

if (新しいフォルダー!=)

{arrfolder=newfolder.split(/)

for(var i=0;i<arrfolder.length-1;i++)

{空白文字+= ;

フォルダーstr+=arrfolder[i]+/;

_o=document.createElement(オプション);

_o.text=blankstr+arrfolder[i];

_o.value=フォルダ文字列;

_obj.add(_o);

}

document.all.select.options[document.all.select.options.length-1].selected=true;

url=getfolder.asp.gl?folder=+folders;

oRoot=getuserlist(url)

strshow=<テーブルクラス=ファイルセルスペース=0セルパディング=0>;

len=oRoot.children.length;

if (レン==1)

{oItem = oRoot.children.item(0);

if(oItem.children.item(0).text==empty)

strshow=ファイルまたはフォルダーはありません。

それ以外

{

if(oItem.children.item(0).text==フォルダ)

{

strshow+=<tr><td><A href=/javascript:parent.userlist('+folders+oItem.children.item(1).text+/+',1)/><img src=/images/mediafolder. gif/ border=0 >+oItem.children.item(1).text+</A></td></tr>;

}

それ以外

{

strshow+=<tr><td><a href=/javascript:parent.addfile('+oItem.children.item(1).text+')/ ><img src=/images/mediafile.gif/ border=0> +oItem.children.item(1).text+</A></td></tr>;

}

strshow+=</table>

}

それ以外{

// データをスタックにプッシュする

for(i=0;i<len;i++)

{ oItem = oRoot.children.item(i);

if(oItem.children.item(0).text==フォルダ)

{

arrff[i]=<A href=/javascript:parent.userlist('+folders+oItem.children.item(1).text+/+',1)/><img src=/images/mediafolder.gif/ border =0>+oItem.children.item(1).text+</A>;

}

それ以外

{

arrff[i]=<A href=/javascript:parent.addfile('+oItem.children.item(1).text+')/><img src=/images/mediafile.gif/ border=0 height=12> +oItem.children.item(1).text+</A>;

}

//出力する列数を取得する

if (len<=6)

{x=1;

y=6;}

それ以外

{x=長さ/6;

y=6;}

for(var i=0;i<y;i++)

{strshow+=<tr>

for(var j=0;j<x;j++)

{ponits=j*y+i;

if (ポニッツ>=レン)

{

strshow+=<td> </td>;

}

それ以外

{

strshow+=<td>+arrff[ponits]+</td>;

}

strshow+=</tr>

}

strshow+=</table>

}

filebox.document.body.innerHTML=strshow;

}

//-->

</スクリプト>

関数 checkfolder(folderstr)

if (folderstr= または instr(folderstr,/)=instrrev(folderstr,/)) then

チェックフォルダー=

それ以外

nfolder=left(folderstr,len(folderstr)-1)

checkfolder=left(nfolder,instrrev(nfolder,/))

終了する場合

終了関数

</script>

</HEAD>

<テーブル幅=443 ボーダー=0 セルスペース=0>

<tr>

<tr>

</select></td>

</tr>

</table></td>

</tr>

<tr>

<tr>

<td>

</tr>

</table></td>

</tr>

<tr>

<入力タイプ=隠し名=フォルダ値=>

<tr>

<td width=85 align=right>ファイル名 (<u>N</u>): </td>

</tr>

</FORM>

<tr>

<td align=right>ファイルの種類 (<u>T</u>):</td>

<オプション>ストリーミングメディアファイル (*.asf、*.wmv、*.wma)</option>

</select></td>

</tr>

</table></td>

</tr>

</テーブル>

</BODY>

</HTML>

ファイルとフォルダーの表示スタイルを定義するために使用される小さなファイルblank.htmもあります。

<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 移行版//EN>

<HTML>

<頭>

<TITLE> 新しいドキュメント </TITLE>

<スタイル>

td{font-size:9pt}

本文{font-size:9pt}

.file A{COLOR: #000000; TEXT-DECORATION: none;font-size:9pt}

.file A:visited{COLOR: #000000; TEXT-DECORATION: none;font-size:9pt}

.file A:hover {COLOR: #000000; TEXT-DECORATION: none;font-size:9pt}

</スタイル>

</HEAD>

</BODY>

</HTML>

呼び出すときは、次の関数を使用して、実際のファイルとまったく同じようにサーバー側でファイルを選択する効果を実現します。

関数選択ファイル()

{

var arr = showModalDialog(selectfile.asp?temp=+Math.random(), , ダイアログ幅:453px; ダイアログ高さ:252px; ステータス:0;ヘルプ:1);

if (arr != null)

{

返却先

}

この関数によって最後に返されるのは、選択されたファイル名です。ファイル選択ボックスから関数で使用される複数の画像を取得できます。