ドラッグで選択できるセルを指定する方法とは？

前へ 次へ
このQ&Aのポイント
  • 施設管理のサイトを作りたいと思っていますが、ドラッグで選択できるセルの範囲を指定したいです。
  • セルをドラッグで選択するときに、最大で２列分だけしか選択できないようにしたいです。
  • また、日付をまたいで選択できないようにする方法も知りたいです。
回答を見る
  • ベストアンサー

先ほども似たような質問をしているのですが、

画像のような画面のセルをドラッグで選択するときに、最大で２列分だけしか選択できないようにしたいと思っています。施設管理のサイトを作りたいと思っています。先ほどした質問でドラッグ できる位置を指定ができるようになったのですがドラッグできる範囲も指定したいのです。 日付をまたいで選択できないようにしたいと思っています。これは、選択しているセルは、色が変わるのですが、できれば日付をまたぐと色が変わらず、選択できないようにしたいです。 ですが選択できても、範囲を決定したときに、エラーメッセージが出てくるというような方法でもかまいません。 厚かましいかもしれませんがお願いします。 以下は </tytle>までのひながた以降のコードです。 わかる方よろしくお願いします。画像の空白部には２４×３０のセルがあります。 <table>～</table>の間には画像のような<td></td>のタグがあります。 よろしくお願いします。 <style type="text/css"> html, body{ margin:0px; } table{ -moz-user-select:none; -khtml-user-select:none; user-select:none; width:500px; height:500px; } table, td, th{ margin:10px; border-style:solid; border-color:black; border-width:1px; } </style> <script type="text/javascript"> var startCell = null; //マウスダウンのイベント処理 function mouseDown(table, e){ if (!e) var e = window.event; startCell = e.srcElement? e.srcElement: e.target; if(startCell.tagName != "TD"){ startCell = null; return; } mouseMove(table, e); } //マウスアップのイベント処理 function mouseUp(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to) return false; //mouseMoveで選択状態表示の更新をさせないようにする startCell = null; //ここに選択後の処理を書く alert("("+from.col+", "+from.row+") -> ("+to.col+", "+to.row+")"); } //マウス移動のイベント処理 function mouseMove(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to) return false; //色を変更 var x, y, cells; for(y=0; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if((from.row-y)*(y-to.row)>=0 && (from.col-x)*(x-to.col)>=0) row.cells.item(x).style.backgroundColor = "#ffdddd";//選択状態の色 else row.cells.item(x).style.backgroundColor = "transparent";//未選択状態の色 } } } //tableの中のcellの位置を取得する function getCellPos(table, cell){ var pos = new Object(); if(cell.nodeName == "TD"){ var x, y, cells; for(y=0; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if(row.cells.item(x) == cell){ pos.row = y; pos.col = x; return pos; } } } } return null; } </script> </head> <body><!-- Google Analytics Start --> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-9296140-1"); pageTracker._trackPageview(); } catch(err) {} </script> <!-- Google Analytics End --> <table onmousedown="mouseDown(this, event); return false;" onmouseup="mouseUp(this, event);" onmousemove="mouseMove(this, event); return false;"> </table> </body> </html>

画像を拡大する

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

さきほどの回答者ですが… ＞最大で２列分だけしか選択できないようにしたいと思っています う～～ん。 それって、もしかすると選択できる2列がセットになっているのではないですか？ （2列目、3列目）、（4列目、5列目）・・・というのであって（3列目、4列目）の2列ではダメとか。 ・・・と勝手に解釈して、今回は2箇所変更。 1）先ほどの箇所 pos.row = y; pos.col = x; pos.day = (x+1 - (x+1)%2) / 2; //←この行を追加 if(2>y || 1>x) pos = null; 2）「//セルの位置を取得」の少し下の if(!from || !to)　の行を if(!from || !to || from.day != to.day) に変更 多分、これで大丈夫だと思いますが・・・ どうも、テーブル外（または、選択禁止セル範囲内）でマウスアップしてみるとわかりますが、必ずしも操作性が良いとは思えません。 また、 ＞施設管理のサイトを作りたいと思っています。 ということなので、あえて書きますが、現在のような逐次的な修正は地道に進んでいるように思えるかも知れませんが、方法としてあまり良い方法とは思えません。 サイトの利用者がこれを利用して予約入力したりするのでしょうか？ あるいは限られた管理者だけが操作するものと仮定しても、予約済みの部分に誤って上書きしない方法はどのように考えていますか？ 一つの予約時間帯をグループとして認識できるようにする方法は？ 何よりも、クライアント側で入力したものを記録しておく方法はどのようにお考えなのでしょうか？（サーバなどにデータを保管しておく方法） また、その情報（サーバ上の情報）をクライアントで表示する方法は？ サイトと言うからには、複数の場所からアクセス可能だと思いますが、ほぼ同時に同じ時間帯への予約があった場合は？ などなど、全体の流れとそれを実現する方法をまとめた上で部分の作成にかからないと、次の問題を解決しようとするたびにそれまでのものを捨てて一から作らなくてはならない羽目に陥る可能性があります。 あるいは、それまでのものに固執するあまり継ぎ足しで、とんでもないものが出来上がる可能性も。

kei114477
質問者

お礼

またしても回答ありがとうございます＾＾ 本当に助かります＾＾ 他の言語（php）での方法では、少なからず時間の重複などの場合の制限やデータの保存などできているのですが、いかんせんユーザーインターフェースに乏しいもので＾＾； この方法と組み合わせたりなどして、作っていきたいと思っています。 何かいい方法があるなどの意見ありましたら、とても助かります＾＾； 本当にありがとうございます＾＾

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

#1です。 内容を理解していないので、的外れかもしれませんが… ＞いかんせんユーザーインターフェースに乏しいもので＾＾； インターフェースに関わる部分だけについて、とりあえず感じたことを。 ・マウスに反応しない部分（タイトル部分や予約済み部分）のセルを識別できるようにしておけば、スクリプトはそれのチェックと日にちを跨がないチェックだけでいけるのではないでしょうか？（具体的にはクラス設定をしておくとか。そのほうが最終的にはスクリプトも単純になるかと思います。） ・上記による識別で、タイトル部分の表示書式や予約済みの部分の表示をCSSで指定しておくことで、位置に関わらず反映することができそう。 既予約のグルーピングも同様のことで識別できると思われます。（例：クラス指定を利用するとしてclass="reserved group1"とか） ・ドラッグのインターフェースとしては、選択対象外（表の外も含む）でマウスアップが行なわれたら、その状態でFixするかキャンセルしてしまった方がわかりやすいのではないでしょうか。 例えば、対象外でマウスアップされたらキャンセルしてしまい、正しい範囲でマウスアップされたらそのまま必要事項の入力ダイアログが表示されるとか。 ・画面表示に関して、ご提示のサンプル（単なるサンプルかも知れませんが）では、均質のセルがずっと並んでいるので右側、下側のセルほど位置を間違えやすいと思われます。 1日の単位（2列単位？）がわかるように区切りを入れたり、1週間単位での区切りを入れたり、土日祝日がわかるようになっていたり… 時間についても同様に何らかのガイドの線があるほうが見やすいと思います。（少なくとも正午の区切りぐらい） ・表の右側が時間と対象しやすいように時間部分の表示は固定しておいて、表を左右にスクロール可能なようにしてあげた方が間違えが少なくなるかと思います。 まぁ、個人の勝手な思いつきレベルの意見なので、参考にもならないとは思いますが・・・

kei114477
質問者

お礼

ありがとうございます＾＾ ファン登録させていただきました＾＾ いろいろなアドバイスなど本当にありがとうございます＾＾ もしよろしければ、これからも、アドバイスお願いいたします＾＾ こんなにもお世話になっているので、完成したときや、進んだときなどに近況報告させていただいてもよろしいですか？ そこでまたアドバイスなどいただけたら嬉しいです＾＾

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • ドラッグでセルを選択した後に

    ドラッグでセルを選択した後に、別の場所をドラッグするとその前に選択したセルの色が消えるようにしたいのですがどなたか方法がわかりますでしょうか？ 施設予約サイトを作っているのですが、間違えた時間をドラッグしたときに、もう一度別のセルをドラッグすると、予約するための情報は最後にドラッグしたときの情報をとるのですが、UI的にはよくないので直したいと思っているのですが、できません。わあかるかたいたらお願いします。 ドラッグは縦一列のみできるように制限をかけています。 下は、セルをドラッグするところに関係するコードです。まだ必要なコード（仕組みが分かるコード）があるときには補足します。 var startCell = null; //マウスダウンのイベント処理 function mouseDown(table, e){ if (!e) var e = window.event; startCell = e.srcElement? e.srcElement: e.target; if(startCell.tagName != "TD"){ startCell = null; return; } mouseMove(table, e); } //マウスアップのイベント処理 function mouseUp(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to) return false; //mouseMoveで選択状態表示の更新をさせないようにする startCell = null; //alert("("+from.col+", "+from.row+") -> ("+to.col+", "+to.row+")"); document.form1.fromcol.value=from.col; document.form1.fromrow.value=from.row; document.form1.tocol.value=to.col; document.form1.torow.value=to.row; } //マウス移動のイベント処理 function mouseMove(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to || from.day != to.day) return false; //色を変更 var x, y, cells; for(y=2; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if((from.row-y)*(y-to.row)>=0 && (from.col-x)*(x-to.col)>=0) row.cells.item(x).style.backgroundColor = "#888888";//選択状態の色 //else // row.cells.item(x).style.backgroundColor = "transparent";//未選択状態の色 } } } //tableの中のcellの位置を取得する function getCellPos(table, cell){ var pos = new Object(); if(cell.nodeName == "TD"){ var x, y, cells; for(y=0; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if(row.cells.item(x) == cell){ pos.row = y; pos.col = x; if(2>y || 1>x) pos = null; pos.day = (x+1 - (x+1)%2) / 2; return pos; } } } } return null; } </script>

  • セルをドラッグで選択するときに、

    ７×７のセルをドラッグで選択をするときに、選択できない場所を作りたいと思っているのですが、どのようにすればいいのでしょうか？ ネット上にあるサンプルでは画像の（０、０）のセルから選択できるのですが、これを（１，２）を選択できるセルの開始点として５×６の範囲で選択できるようにしたいと思っています。 </tytle>までのひながた以降のコードです。 わかる方よろしくお願いします。 <style type="text/css"> html, body{ margin: 0px; } table{ -moz-user-select: none; -khtml-user-select: none; user-select: none; width: 500px; height: 500px; } table, td, th{ margin: 10px; border-style: solid; border-color: black; border-width: 1px; } </style> <script type="text/javascript"> var startCell = null; //マウスダウンのイベント処理 function mouseDown(table, e){ if (!e) var e = window.event; startCell = e.srcElement? e.srcElement: e.target; if(startCell.tagName != "TD"){ startCell = null; return; } mouseMove(table, e); } //マウスアップのイベント処理 function mouseUp(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to) return false; //mouseMoveで選択状態表示の更新をさせないようにする startCell = null; //ここに選択後の処理を書く alert("("+from.col+", "+from.row+") -> ("+to.col+", "+to.row+")"); } //マウス移動のイベント処理 function mouseMove(table, e){ if (!e) var e = window.event; var endCell = e.srcElement?e.srcElement:e.target; if(!(endCell.tagName=="TD" && startCell)) return false; //セルの位置を取得 var from = getCellPos(table, startCell); var to = getCellPos(table, endCell); if(!from || !to) return false; //色を変更 var x, y, cells; for(y=0; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if((from.row-y)*(y-to.row)>=0 && (from.col-x)*(x-to.col)>=0) row.cells.item(x).style.backgroundColor = "#ffdddd";//選択状態の色 else row.cells.item(x).style.backgroundColor = "transparent";//未選択状態の色 } } } //tableの中のcellの位置を取得する function getCellPos(table, cell){ var pos = new Object(); if(cell.nodeName == "TD"){ var x, y, cells; for(y=0; y<table.rows.length; y++){ row = table.rows.item(y); for(x=0; x<row.cells.length; x++){ if(row.cells.item(x) == cell){ pos.row = y; pos.col = x; return pos; } } } } return null; } </script> </head> <body><!-- Google Analytics Start --> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-9296140-1"); pageTracker._trackPageview(); } catch(err) {} </script> <!-- Google Analytics End --> <table onmousedown="mouseDown(this, event); return false;" onmouseup="mouseUp(this, event);" onmousemove="mouseMove(this, event); return false;"> <tr> <td>(0,0)</td><td>(1,0)</td><td>(2,0)</td><td>(3,0)</td><td>(4,0)</td><td>(5,0)</td><td>(6,0)</td> </tr> <tr> <td>(0,1)</td><td>(1,1)</td><td>(2,1)</td><td>(3,1)</td><td>(4,1)</td><td>(5,1)</td><td>(6,1)</td> </tr> <tr> <td>(0,2)</td><td>(1,2)</td><td>(2,2)</td><td>(3,2)</td><td>(4,2)</td><td>(5,2)</td><td>(6,2)</td> </tr> <tr> <td>(0,3)</td><td>(1,3)</td><td>(2,3)</td><td>(3,3)</td><td>(4,3)</td><td>(5,3)</td><td>(6,3)</td> </tr> <tr> <td>(0,4)</td><td>(1,4)</td><td>(2,4)</td><td>(3,4)</td><td>(4,4)</td><td>(5,4)</td><td>(6,4)</td> </tr> <tr> <td>(0,5)</td><td>(1,5)</td><td>(2,5)</td><td>(3,5)</td><td>(4,5)</td><td>(5,5)</td><td>(6,5)</td> </tr> <tr> <td>(0,6)</td><td>(1,6)</td><td>(2,6)</td><td>(3,6)</td><td>(4,6)</td><td>(5,6)</td><td>(6,6)</td> </tr> </table> </body> </html>

  • 特定の列の<td>または<th>だけにスタイルを

    かけたいということがあります。 例えば、 ---------------------------------------------------------- <style type="text/css"> .tab1 th, .tab1 td { font-weight:normal; text-align:center; background:#fee; } .tab1 .row2 th { /* ----------------(1) */ background:#fff; } .tab1 .col2 th { /* ----------------(2) */ background:#ffff; } </style> <table class="tab1"> <col class="col1"> <col class="col2"> <col class="col3"> <tr class="row1"> <th>1</th> <th>2</th> <th>3</th> </tr> <tr class="row2"> <th>4</th> <td>5</td> <td>6</td> </tr> <tr class="row3"> <th>7</th> <td>8</td> <td>9</td> </tr> <table> ---------------------------------------------------------- だと、 1 2 3 4 5 6 7 8 9 の中の「4」は(1)により背景が白くなります。 しかし、(2)のようにしても「2」の背景は白くなりません。 <col>ってそういうものなのでしょうか？ <td>または<th>にidをつけてスタイルをかけるしかないのでしょうか？ よろしくお願いします。

    • ベストアンサー
    • HTML
  • キーボードショートカットでthickboxなどを起動したいのですが・・・・

    よろしくお願いいたします。 Webアプリのデザインを作成中なのですが、 javascriptでキーボードのショートカットキーを押してログイン画面を出したいと思い、できれば特定のキーを押したときにthickboxやlightboxでHTMLを表示できないかなと思っているのですが可能でしょうか？ 以下のソースで一応Fキーを押すとリンクだけはできるのですが、 thickboxを定義するとなるとclassnameをどのように定義すればよいのでしょうか。 あまりJSの知識がないので、ご助力いただければ幸いです。 どうぞよろしくお願いいたします。 function shouldIgnoreInput(e) { var el = e.target || e.srcElement return el && el.tagName && (el.tagName.toUpperCase() == "INPUT" || el.tagName.toUpperCase() == "SELECT" || el.tagName.toUpperCase() == "TEXTAREA"); } function hotkey(e) { var nav4 = window.Event ? true : false; if(shouldIgnoreInput(e)) { return true; } if ((typeof e.ctrlKey != 'undefined') ? e.ctrlKey : e.modifiers & Event.CONTROL_MASK > 0) { return true; } if ((typeof e.altKey != 'undefined') ? e.altKey : e.modifiers & Event.ALT_MASK > 0) { return true; } if ((typeof e.metaKey != 'undefined') && e.metaKey) { return true; } else if((typeof Event != 'undefined') && (e.modifiers & Event.META_MASK > 0)) { return true; } if (nav4) var whichCode = e.which else if (e.type == "keypress") var whichCode = e.keyCode else var whichCode = e.button; if( whichCode == 114) { cancelEvent(e); window.location.reload(); return false; } else if( whichCode == 102 ) { cancelEvent(e); url = "login.html"; window.location.href = url; return false; } return true; } function cancelEvent(event) { if (event.preventDefault) { event.preventDefault(); event.stopPropagation(); } else { event.returnValue = false; } }

  • インラインフレーム内の変数を親ページから呼び出す

    インラインフレーム内のマウス位置を↓のjavascriptコードで取得しているのですが、親ページのjavascriptの関数で使用したいです。どのようにインラインフレーム内の変数を親ページから呼び出して、利用すればよいのでしょうか？ var x, y; window.addEventListener("DOMContentLoaded", function(){ window.document.onmousemove = function(e){ x = getMousePosition(e).x; } },false); function getMousePosition(e) { var obj = new Object(); if(e) { obj.x = e.pageX; obj.y = e.pageY; } else { obj.x = event.x + document.body.scrollLeft; obj.y = event.y + document.body.scrollTop; } return obj; }

  • Javascriptでテーブルタグの座標が知りたい（但し、マウスでなく）

    <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>JavaScriptテスト</title> <script type="text/javascript"> <!-- document.onmousedown = msDown //----------------------------------------------------------------------------- // マウスで座標を取得する //----------------------------------------------------------------------------- function msDown(){ var x = event.x; var y = event.y; alert('x=[' + x + '] y=[' + y + ']'); } // --> </script> </head> <body> テーブルタグの<TD>で左上側の画面上の位置の座標位置を取得したいです。 offsetLeftやoffsetTopでは、例えばテーブルタグの上側に<p>がある場合と無い場合でも同じ値でした。 正しく取得する方法はありますか？ <hr> <table cellspacing="0" cellpadding="2" border="1" bgcolor="black"> <tbody> <tr> <td><img src="" width="100" height="100"></td> <td bgcolor="red">この赤のエリアの左上の座標が知りたい（マウスイベントで調べられるが、それを使わずに調べたい） </td> </tr> <tr> <td>456</td> <td><img src="" width="50" hright="50"></td> </tr> </tbody> </table> </body> </html>

  • WebDatabaseのlistから選択項目表示

    HTML5 Web Database でlistから選択した項目を詳細表示したい。詳細一覧detail_b()押下した際、listで選ばれているレコード内容を表示したい。色々試しているのですが・・・どこがおかしいかわかりません。 function load() で list.options[list.options.length] = new Option(row.val2, row.val, row.key1); 項目表示した場合、 function detail_b() で どのようなSELECT文を書けば listで選択された行を指定できるのですか？ <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script type="text/javascript"> var db = openDatabase("my_sample3", "", "Sample for my3", 1024*1024); db.transaction(function(tx) { tx.executeSql("create table if not exists storage (key1, val, val2)"); }); function load() { db.transaction(function(tx) { tx.executeSql("select * from storage", [], function(tx, rs) { var list = document.getElementById("list"); list.innerHTML = ""; var rows = rs.rows; for (var i = 0, n = rows.length; i < n; i++) { var row = rows.item(i); list.options[list.options.length] = new Option(row.val2, row.val, row.key1); } }); }); } function detail_b() { var list = document.getElementById("list"); if (list.selectedIndex < 0) { return; } var selected = list.options[list.selectedIndex].value; db.transaction(function(tx) { tx.executeSql("select * from storage where key1 = ?", [selected], function(tx, rs) { var rows = rs.rows; var row = rows.item(0); detail.innerHTML = ""; detail.options[detail.options.length] = new Option(row.val2, row.val, row.key1); }); }); } function remove() { 省略 } function add() { 省略 } </script> </head> <body onload="load()"> <h1></h1> <table border="0"> <tbody> <tr> <td colspan="2"><select id="list" size="5" style="width: 200px"></select></td> <td><button onclick="detail_b()">詳細一覧</button><BR><button onclick="remove()">削除</button></td> <td rowspan="4"><select id="detail" size="5" style="width: 400px"></select></td> </tr> <tr> <td><font face="Times New Roman">キー:</font></td> <td><input type="text" id="key1"></td> <td></td> </tr> <tr> <td><font face="Times New Roman">値:</font></td> <td><input type="text" id="value"></td> <td></td> <td></td> </tr> <tr> <td><font face="Times New Roman">値２:</font></td> <td><input type="text" id="value2"></td> <td><button onclick="add()">追加</button></td> </tr> </tbody> </table> </body> </htm>

    • ベストアンサー
    • HTML
  • VBAユーザーフォームを使った入力で文字列になる

    お世話になります。 ユーザーフォームを使った入力で日付や金額を入力する箇所があります。 例えば日付で2019/12/2と入力したところ、反映されるExcelシートには日付ではなく文字列で入力されたことになります。 セルの書式設定を日付にしていても文字列になってしまいます。 下記にコードを入力しておきます。 ご教示のほど宜しくお願い致します。 Sub Registration(Row As Long) ' Dim Col As Integer Dim TCount As Integer Dim CCount As Integer ' TCount = 1 ' For Col = 2 To Len(Table) ' If Mid(Table, Col, 1) = "T" Then TCount = TCount + 1 Cells(Row, Col) = Controls("TextBox" & TCount) Controls("TextBox" & TCount) = "" Else CCount = CCount + 1 Cells(Row, Col) = Controls("ComboBox" & CCount) Controls("ComboBox" & CCount) = "" End If Next Col End Sub

  • ファンクションキー制御？

    こんにちわです。 タイトル通りなのですが、 JSでは、 function kdown(e) {var msg =""; var flg = 1; switch(window.event.srcElement.tagName){ case "INPUT" :if(event.srcElement.type != "text" && event.srcElement.type != "password" && event.keyCode!=9 && event.keyCode!=16 && event.keyCode!=32){return false;}else{flg=0;}break; case "TEXTAREA" :flg = 0;break; case "SELECT" :flg = 0;break; case "A" :flg = 2;break; } switch(event.keyCode){ case 8 :msg = "BS";break; case 78 :if(event.ctrlKey){msg = "Ctrl+N";}break; case 82 :if(event.ctrlKey){msg = "Ctrl+R";}break; case 116 :msg = "F5";break; case 122 :msg = "F11";break; } if(event.altKey){msg = "Alt";} if (flg == 0 ){switch(event.keyCode){case 8 :msg = "";break;case 13 :msg = "";break;}} else if (flg == 2 && event.keyCode==13)msg = ""; if(msg != ""){event.keyCode = 0;return false;}else{return true;} } document.onkeydown = kdown; こんな感じに制御するのを、 アクションスクリプトで制御出来ますか？ HTMLにこのJS埋め込んでも、FLASHの所クリックして、 各キー押すと意味なくなってしまうので・・ F5やF11など使用されたくないのですが・・・ 入れ替えなどでも良いのですが。。。 宜しくお願いします。

  • クリックごとに文字色が交互に変化する（赤青赤青赤青・・・・・）

    クリックごとに文字色が変化するプログラムを作りたいのですがchangeColor()の部分の処理がうまく動作しません。おそらくif文の条件の表記が間違っていると思うのですが、どのように書き換えればいいのでしょうか？ <html> <head> <script language="JavaScript"> <!-- function changeColor() { if(event.srcElement.style.color="#ff0000")changeBlue(); else changeRed(); } function changeRed() { event.srcElement.style.color="#ff0000"; } function changeBlue() { event.srcElement.style.color="#0000ff"; } //--> </script> </head> <body > <table border="10" width="100" height="100" align="center" valign="top" bgColor="#ffffff"> <tr> <td><a href="javascript:void(0)"onClick="changeColor()"><font size="7">A</font></a></td> <td><a href="javascript:void(0)"onClick="changeColor()"><font size="7">B</font></a></td> </tr> </table> </body> </html>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する