|
[移動中]
ボタンの1〜4は反応しますが、ボタン5にドロップしても反応はしません。 これは、1〜4の onMouseOver / onMouseOut に指定されている処理でドロップ対象の指定・解除を行っている為です。 Java Script のソースコードです。 <script type="text/javascript"> <!-- var offsetX; var offsetY; var obj; //ドラッグオブジェクト var mbox; //マウスカーソルに追従する div オブジェクト var tarbox; //ドロップ先を識別する為の string //IEかどうか適当な判定(^-^; function isIE() { if (document.all) { return 1; //IE です。 } else { if (document.getElementsByTagName) { return 2; //IE以外です。 } else { return 0; //不明です。 } } } function getscrollLen() { var pos = new Object(); pos.x = document.documentElement.scrollLeft || document.body.scrollLeft; pos.y = document.documentElement.scrollTop || document.body.scrollTop; return pos; } onload=function () { switch ( isIE() ) { case 0: return; break; //分からないので止める。(^-^; case 1: objs = document.all.tags("td");//IE用にタグ取得 break; case 2: objs = document.getElementsByTagName("td");//IE以外用のタグ取得 } //ドラッグ元になるタグがテーブル内の TD ですので、上記では TD を取得していますが //これを DIV にしたりすれば任意のオブジェクトに変更することができます。 //オブジェクト(エレメント)のリストより、ID に "MAILID" が含まれているタグのみ oMouseDown をセットします。 //これはドラッグ元を識別する為の処理です。 for (i=0; i<objs.length; i++) { if (objs[i].id.indexOf("MAILID") != -1) { objs[i].onmousedown = onMouseDown; } } //ドキュメント全体に onMouseMove / OnMouseUp を設定します。 document.onmousemove = onMouseMove; document.onmouseup = onMouseUp; } function onMouseDown(el) { //クリックした際にドロップ先指定を初期化します。 //これはドロップ先のボタンにマウスカーソルを当てた場合にもセットされる為です。 //マウスを離した際にのみセットをしたい為、このような処理を行っています。 tarbox = ""; document.mailddform.MOVEBOXNAME.value = ""; //マウス追従用の div オブジェクトを取得します。 mbox = document.getElementById("miconid"); //クロスブラウザ用に、ドラッグしたオブジェクトを確保します。 obj = this; if (mbox) { //マウスカーソルの形状を変更。 document.body.style.cursor = "crosshair"; //追従用の div を表示。 mbox.style.visibility = "visible"; //以下は無くても良いのですが、クリックした時点で追従用の div 位置をマウス位置に設定します。 switch ( isIE() ) { case 0: return true; break; case 1: offsetX = event.offsetX + 10; offsetY = event.offsetY + 3; break; case 2: offsetX = el.pageX+10; offsetY = el.pageY+3; break; } //Firefox では数値を直接入れてもパースがどうこうエラーがでますので、"px" を追加し、pixel と識別させます。 mbox.style.left = offsetX + "px"; mbox.style.top = offsetY + "px"; } return false; } function onMouseMove(el) { //mbox が存在する場合は、マウスカーソルに mbox (追従用 div)をくっつけて移動させます。 //上にもありますが、3 とか 10 はずらすための数値です。マジックナンバーは良くないので //変数で定義した方が良いと思います。 if (mbox) { switch ( isIE() ) { case 0: break; case 1: mbox.style.left = event.clientX + 10 + getscrollLen().x; mbox.style.top = event.clientY + 3 + getscrollLen().y; break; case 2: mbox.style.left = el.pageX + 10 +"px"; mbox.style.top = el.pageY + 3 +"px"; break; } return false; } else { return true; } } function onMouseUp(el) { //カーソルを戻します。 document.body.style.cursor = "auto"; if (mbox && obj) { if (tarbox!="") { //substring を利用して必要な情報を取り出します。 //ドラッグ元の ID を識別させる為のキーとデータをセットにしている訳です。 //ドラッグ元に value で値を持てる物を利用している場合はそちらを利用すれば良いですが、無い場合は //このような方法で処理を行っています。 document.mailddform.MAILID.value = obj.id.substring(6,obj.id.length); (*1) } //追従用 div を消して、他のオブジェクト等を初期化します。 mbox.style.visibility = "hidden"; mbox = null; obj = null; tarbox=""; } } function onBoxName(mmbox) { tarbox = mmbox; document.mailddform.MOVEBOXNAME.value = mmbox; } function onBoxOut() { tarbox = ""; document.mailddform.MOVEBOXNAME.value = ""; } --> </script> おまけコード 下記のコードを利用した場合、onBoxName() / onBoxOut() を利用しなくともドロップ先を取得することができます。(*1 の部分と差し替え) ただし、getBoundingClientRect() に対応していないバージョン(Webkit を利用している、Google Chrome 1.0.154.53 など)では動きません。 switch ( isIE() ) { case 0: return; break; case 1: objs = document.all.tags("input"); var px = event.clientX; var py = event.clientY; break; case 2: objs = document.getElementsByTagName("input"); var px = el.pageX; var py = el.pageY; } for (i=0; i<objs.length; i++) { if (objs[i].type == "submit") { if ( objs[i].getBoundingClientRect ) { var _p=objs[i].getBoundingClientRect(); var scx = getscrollLen().x; var scy = getscrollLen().y; if ((_p.left <= px) && (_p.right >= px) && (_p.top+scy <= py) && (_p.bottom+scy >= py)) { if (obj) { document.mailddform.MAILID.value = obj.id.substring(6,obj.id.length); } } } } }
謝辞 |
@AKISoftOfficialをフォロー
掲示板 サポートBBS PMailServer BBS アクセスの多い記事
最新記事(カテゴリ別)
PMailServer2 Version 2.53 をリリースしました。
04/08 00:50 フリー版からの製品版移行時の MTA 並列数について 02/17 23:52 メールサーバーの開発を始めて20年 02/07 21:46 PMailServer2 Version 2.52a をリリースしました。 12/26 14:02 PMailServer2 Version 2.52 をリリースしました。 10/01 10:48 PMailServer2 Version 2.51b をリリースしました。 09/19 01:43 PMailServer2 Version 2.51b(仮) Memo 09/12 00:33 PMailServer2 Version 2.51a をリリース、及び脆弱性についてのお知らせ 09/05 01:15 PMailServer2 Version 2.51a Memo 08/21 00:48 アドレスV125(K5)のスターターリレーの交換 08/04 10:10 最新コメント
Androidタブレットの殻割り
A.K.I Software [11/25 09:54]
noppo [11/23 10:13] PMailServer2 Version 2.47 をリリースしました。 A.K.I Software [09/25 22:33] noppo [09/25 09:11] 「ローカルデバイス名はすでに使用されています。この接続は復元されませんでした。」への対処 スモモ太郎 [04/07 08:54] くま [03/03 10:13] 関さん [02/22 11:10] A.K.I Software [11/17 15:30] ちせか [11/17 12:05] Windows10 で音(サウンド)のフェードインが無効に出来ない件 A.K.I Software [12/09 00:56] 通りすがりの通りすがり [12/08 17:14] PMail Server2 Version 2.23 をリリースしました あま [11/06 17:51] A.K.I Software [11/06 16:13] UUアクセス数
今日は 110回
昨日は 501回 トータル 306527回 3ヶ月記事別ランキング
プロフィール
Z80から68系、8086系を経由して
Pascalに移行。現在は Delphiをメインに C/C#も囓ってみたり。 「無い物は作れ」の精神で年がら年中なにかを作っています。 すぐ自前で作りたがるので無駄に工数が上がったりして自爆してみたりもします。 好きな物は麺類とお煎餅 Blom内検索
BLOM Version 1.39 ©2007-15 A.K.I Software all rights reserved. |