spinelzのjavascript使用方法
- javascript初心者でも簡単にspinelzのjavascriptを使う方法を解説します
- spinelzのjavascript(外部ファイル）の呼び出し方や使用方法について詳しく解説します
- spinelzのjavascriptを使用してデータの変更が可能なテーブルを作成する方法について解説します
- ベストアンサー
spinelzのjavascript使用方法
javascript初心者です。 spinelzのjavascript(外部ファイル）使用方法について質問があります。 今、”Grid”のデモ(http://script.spinelz.org/index.html)をコピーして、（データの変更が可能な）テーブルを作成しようと思っています。 以下のように作成すると、テーブルのデータは表示されるのですが、デモのようには動きません。 (外部ファイルのjavascriptが呼び出されていないようです。) どなたかご教授いただけませんでしょうか。 ↓HTML↓ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <!-- #BeginTemplate "../Templates/01.dwt" --> <head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <meta http-equiv="content-style-type" content="text/css"> <meta http-equiv="content-script-type" content="text/javascript"> <title>TEST</title> <link href="../css/01.css" rel="stylesheet" type="text/css"> </head> <body> <!-- - ここから JavaScript 記述です。 - --> <script src="../Public\javascripts/spinelz/grid.js" type="text/javascript"></script> <script src="../Public\javascripts/spinelz/grid_resizeEx.js" type="text/javascript"></script> <script src="../Public\javascripts/spinelz/grid_sortabletableEx.js" type="text/javascript"></script> <!-- - ここまで JavaScript 記述です。 - --> <table> <tr> <td>Column</td> <td> <input type="button" class="button" value="add" onclick="grid.addColumn(grid.targetColIndex,'new Column');" /> <input type="button" class="button" value="remove" onclick="grid.deleteColumn(grid.targetColIndex);" /> </td> </tr> ・ ・ (ボタンの記述) ・ ・ </table> <div id="grid_container" > <table width="100%" border="0"> <thead> <tr> <td class="top" style="height: 22px">日付</td> </tr> </thead> ・ ・ (テーブルのデータを記述) ・ ・ </table> </div> ↓javascriptは下記パスに保管↓ ・「Public\javascripts/spinelz/grid.js」 ・「Public\javascripts/spinelz/grid_resizeEx.js」 ・「Public\javascripts/spinelz/grid_sortabletableEx.js」 以上です。よろしくお願い致します。
- idera_2010
- お礼率85% (48/56)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
Public\javascripts で、ディレクトリー名ですか？ Publicがホームルートであるなら ../javascripts/spinelz/grid.js ../ 自分が存在しているディレクトリーの親ディレクトリーからたどる ./ 自分が存在しているディレクトリーからたどる / ルートディレクトリーからたどる です。
関連するQ&A
- ボタンを押して別の画面を表示する方法
html内でボタンを押した後、別のプログラム(html,jspなど)を画面に表示したいのですが、どなたかやり方わかりますか？ <ボタンのhtml> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Cache-Control" content="no-cache"> <meta http-equiv="Expires" content="Thu, 01 Dec 1994 16:00:00 GMT"> <title>住所検索システム</title> <link href="./pjcommon/style/menusub.css" rel="stylesheet" type="text/css"> <script language="JavaScript" src="./js/keypresscheck.js" ></script> <script language="JavaScript" src="./js/login.js" ></script> </head> <!-- <body onContextMenu="return false;" onLoad="document.loginForm.tanCd.focus();" > --> <body onLoad="document.loginForm.tanCd.focus();" > <div align="center"> <h1>住所検索システム</h1> <form name="loginForm"> <table border="0"> <td rowspan="2"> </td> <td> <input type="button" class="loginField" value="住所コード検索" style="width:700px; height:120px;" > <form action="/pg-test/jyuflm2.jsp" target="jyusyo2" method="post"> </td> </tr> <td> <input type="button" class="loginField" value="住所検索入力" style="width:700px; height:120px;" > </td> </tr> </tr> </table> </div> </body> </html>
- 締切済み
- HTML
- HTMLのJavaScriptが動作しない
以下のプログラムのとおり、HTMLにテキストボックスを設置して、FORMタグのACTIONで次のPHP(PHTML)ファイルへ送る仕組みを作っています。 JavaScriptでテキストボックスが空白の場合にチェックするようにしているのですが、動作せずに次のPHPへ渡してしまいます。 詳しい方よりご教授頂ければと思います。 お手数お掛けして申し訳ございませんが、よろしくお願いいたします。 ・HTML # more index.html <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <SCRIPT language=JavaScript type=text/javascript> function generatorCheck(){ if(document.toroku.word1.value == ""){ alert("空白です。"); return false; } if(document.toroku.word2.value == ""){ alert("空白です。"); return false; } } </SCRIPT> <form method="POST" action="result.phtml"> <TABLE cellpadding=10> <tr><td><B>入力項目1</B></td><td><input type="text" name="word1" size=34></td><td>(例：)</td></tr> <tr><td><B>入力項目2</B></td><td><input type="text" name="word2" size=34></td><td>(例：)</td></tr> </table> <BR> <input type=submit value="作成" onClick=generatorCheck()><input type=reset value="消去"> </form> </TABLE> </BODY> </HTML> ・PHP(PHTML) # more result.phtml <? require('../include/init.inc'); $word1 = $_POST{'word1'}; $word2 = $_POST{'word2'}; ?> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> <LINK href="index.css" type="text/css" rel="stylesheet"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <? print ("</BR>"); print ("<B>".$word1."</B>"); print ("</BR>"); print ("<B>".$word2."</B>"); print ("</BR>"); ?> </BODY> </HTML>
- ベストアンサー
- HTML
- クリアボタンの動作について その３
ご存知の方、ご教授くださいm(__)m クリアボタンの動作についてその２、の続きです。 現在、画面上で表示された表項目を消去するために表データクリアボタンを設置しており、 画面中の、表データを削除したいと考えています。 現状のHTMLは以下のようなものです。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>test</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $().ready ( function() { $('.buttons :button[name=clear]').click ( function() { alert('come!'); $('input[type="text"]').not('[disabled="disabled"]').val ( '' ); $('input[type="checkbox"]').removeAttr ( 'checked' ); }); $('.buttons :button[name=clear_table]').click ( function() { alert('come2!'); //<tbody>の中身を消すコード }); }); </script> <style type="text/css"> </style> </head> <body id="main"> <form> <input type="text" name="n1"> <input type="text" name="n2"> <input type="text" name="n1" value="3" disabled> <hr> <input type="checkbox" value="2"> <input type="checkbox" value="2"> <hr> <button type="button" name="clear">クリア</button> <button type="button" name="table_clear">表クリア</button> </form> <div class="data_area"> <table id="schedule_head_table" class="data_table" border=1> <thead> <tr> <th width="60">No.</th> <th width="100">品名コード</th> </tr> </thead> <tbody id=tbody> <tr> <td><div class=right-align>1</div></td> <td>item_code</td> </tr> </tbody> </table> </div> </body> </html> 解決方法を教えていただけると助かります。 もし可能であれば、クリアボタン自体が動作しない理由も教えていただれば、今後の参考にさせていただきます。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- 外部ファイルJS参照を全て消さないと「文字が正しくありません」エラー
実に不思議なのですが、 以下のように4つのJSファイルをインクルードしているHTMLファイルを ローカルで開くと「文字が正しくありません」とスクリプトエラーが何回かでます。 ですが、script1～4.js の行を全てコメントアウトすると、エラーはでません。 1～4のどれかにエラーが含まれているのかと、一つ一つを外してみましたが、 どの行を外しても、やはり「文字が正しくありません」と出てしまいます。 ローカルの然るべきパスに1～4はあります。また、HTML同様、JSもEUCになってます。 何が原因なのでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <title>タイトル</title> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-style-type" content="text/css"> <link href="../css/style.css" rel="stylesheet"> <script src="../js/script1.js" type="text/javascript"></script> <script src="../js/script2.js" type="text/javascript"></script> <script src="../js/script3.js" type="text/javascript"></script> <script src="../js/script4.js" type="text/javascript"></script> </head>
- ベストアンサー
- JavaScript
- 記入内容のチェックについて
javascriptの初心者です。どうぞよろしくお願いいたします。 下記のような内容で「商号」が空欄の場合「確認」ボタンを押すとアラートがかえってきて欲しいのですがうまくいきません。原因が分かる方いらっしゃいますか？ <html> <head> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <Script Language="JavaScript" src="common.js"></Script> <Script Language="JavaScript"> <!-- function kakunin_click(){ //入力チェック if(document.OnForm.syogo.value == ""){ //必須入力 alert("商号に入力がありません。"); document.OnForm.syogo.focus(); return false; } document.OnForm.submit(); return true; } //--> </Script> <title>契約</title></head> <body> <form name="OnForm" method=post action="***.cgi"> <center> <TABLE border="0" cellspacing="1"> <tr> <TD>商号</TD> <TD><INPUT type="text" size="42" name="syogo"></TD> </tr> </TABLE> </center> <div align="center"> <center> <table border="0"> <tr> <td width="100%"> <input onclick="kakunin_click()" type="submit" value="確認"><input type="reset" value="やり直し"></td> </tr> </table> </center> </div> </form> </body> </html>
- ベストアンサー
- JavaScript
- タブに地図を入れたら、中心がずれました。
タブに地図を入れたら、中心がずれました。 タブはないとき、ずれないです。 あれこれ試しましたが、どうも修正できませんでした。 教えてください。お願いします。 下はソースです。 <html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script src="http://5am.jp/common/js/jquery-1.3.1.min.js" type="text/javascript"></script> <script src="http://5am.jp/common/js/ui.core.js" type="text/javascript"></script> <script src="http://5am.jp/common/js/ui.tabs.js" type="text/javascript"></script> <link type="text/css" rel="stylesheet" href="http://5am.jp/common/css/ui.tabs.css"> <script type="text/javascript"> $(function() {$('#container-1 > ul').tabs();}); </script> </head> <body> <div id="container-1"> <ul> <li><a href="#fragment-1"><span>タブ1</span></a></li> <li><a href="#fragment-2"><span>タブ2</span></a></li> <li><a href="#fragment-3"><span>タブ3</span></a></li> </ul> <div class="Clear"> <div id="fragment-1"> <p>タブ1の内容</p> </div> <div id="fragment-2"> <p>タブ2の内容</p> </div> <div id="fragment-3"> <table width="705" border="0" cellpadding="0" cellspacing="0"> <tr><td class="button-area"><div align="center"> </div></td> </tr> <tr><td> </td> </tr> </table> <div id="map_canvas" style="width: 705px; height:375px"></div> <script src="http://maps.google.co.jp/maps?file=api&v=1&key=ABQIAAAAQzfW6rb5jraVXMAQHx8W2hRz0pttuSXoxOtnDzBeMrT8H_GbDhS6TtNcJU1K_O_fBt6-ziKGKvN9gg" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> if (GBrowserIsCompatible()) { var map = new GMap(document.getElementById("map_canvas")); var point = new GLatLng(35.778976, 139.725286) map.setCenter(point, 15); var marker = new GMarker(point); map.addOverlay(marker); map.addControl(new GLargeMapControl()); marker.openInfoWindowHtml('東京都北区赤羽2-5-7 '); } </script> </div></div></div></body></html>
- 締切済み
- JavaScript
- javascriptで文字を移動後、プルダウン表示させたい。
(1)移動処理 http://www.openspc2.org/JavaScript/Ajax/Effect/Rico/002/index.html (2)上から内容を表示 http://www.openspc2.org/JavaScript/Ajax/Effect/script.aculo.us/004/index.html (1)→(2)の処理の順番動かそうと思い、javascriptを組んでみたのですが、動きません。 new Rico.Effect.Position("movilisez", 400,300, 100, 20);を コメントアウトすると、(2)の処理は動いてくれますが、 コメントを外すと動きません。 原因を教えていただけますでしょうか？ 環境は以下です。 OS:VISTAHomepremium ブラウザ:IE7 --------------------- function toPoint() { new Rico.Effect.Position("movilisez", 400,300, 100, 20); execEffect(); } function execEffect() { document.getElementById("contents").style.visibility = "visible" new Effect.BlindDown($("contents")); } --------------------- --------------------- <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="Style_Index.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="scripts/prototype-1.6.0.3.js"></script> <script type="text/javascript" src="scripts/scriptaculous-js-1.8.2/src/scriptaculous.js?load=effects"></script> <script type="text/javascript" src="scripts/rico.js"></script> <script type="text/javascript" src="scripts/BlindDown.js"></script> <title>TestPage</title> </head> <body> <div align="center"> <p></p><div id="Hedder" align="center"><table width="800px" cellspacing="0"> <tr> <td colspan="2" rowspan="2" align="left"><img src="" alt="" name="movilisez" width="200" height="80" id="movilisez" onclick="toPoint()" /></td> </tr> </table></div> <div id="contents"> <div id="menu" align="center"> メニュー </div> </div> </div> </body> </html>
- ベストアンサー
- JavaScript
- 画面の２重起動をチェックする方法について
画面の２重起動をチェックする方法について PHPかJavaScriptどちらで実現できるかわかりませんが... 【確認】ボタンを押下で【確認画面】を別画面で表示します。 既に【確認画面】が起動されていたら 【既に表示されています】OR【起動されている画面を前面に表示】など できないかなぁと思っています。 このようなご経験がある方、よろしくお願いします。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="content-style-type" content="text/css"> <title>２重起動チェックテスト</title> <script type="text/javascript"> function kogamen_check() { //**************************************************** //ここで確認画面(kakunin.php)が起動済かチェックできないでしょうか？ //**************************************************** } </script> </head> <body> <table align = "center" cellspacing="0"> <form name="form1" action="kakunin.php" method="post" target="_blank" onSubmit="return kogamen_check()"> <tr> <td align="right">項目１</td> <td><input type="text" name="item1" size="10" maxlength="10"><br> </tr> <tr> <td align="right">項目２</td> <td><input type="text" name="item2" size="10" maxlength="10"><br> </tr> <tr> <td><br></td> <td align="center"> <input type="submit" name="kakunin" value="確認"> <input type="button" value="メニューへ" onClick="parent.location = 'menue.php'"> </td> </tr> </form> </table> </body> </html>
- ベストアンサー
- JavaScript
- javascriptでちゃんと表示されない。
javascriptの参考書通りに書いてるのになぜか出ません。 なぜか、新製品と価額だけしかでません。 リラックスチェアとか価額４０００とかが出ません。 何が原因かわかりません。 何が原因なんでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>はじめてのHTML</title> <style> table{border:solid 1px orange; border-spacing:0pc;} th,td{border:solid 1px orange; padding:4px;} </style> <script type="text/javascript"> var prod_name={'リラックスチェア','リラックスデスク','ブックスタンド'}; var prod_price ={4000,12000,800}; </script> </head> <body> <h1>新商品価額表</h1> <table> <thead> <tr><th>製品名</th><th>価額</th></tr> </thead> <tbody> <script type="text/javascript"> document.write('<tr>'); document.write('<td>'+ prod_name[0]+'</td>'); document.write('<td>'+ prod_price[0]+'</td>'); document.write('</tr>'); </script> </tbody> </table> </body> </html>
- ベストアンサー
- JavaScript
- 日本語記述が出来ません（XML?)
初めて質問いたします。 海外のホームページテンプレートを購入し、編集しているのですがなぜか日本語表記がされなくて困っています。 CSS部分には問題なさそうなのですが、誰か原因がわかりましたら教えていただけると助かります。 ちなみにfirefoxもIEも同様でした。どうぞ宜しくお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <title>○○○○</title> <meta http-equiv="Content-Type" content="text/html; charset="shift-jis" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <link href="style.css" rel="stylesheet" type="text/css" /> <link href="layout.css" rel="stylesheet" type="text/css" /> <script src="js/jquery-1.2.1.js" type="text/javascript"></script> <script type="text/javascript" src="js/cufon-yui.js"></script> <script src="js/cufon-replace.js" type="text/javascript"></script> <script src="js/Swis721_Th_BT_400.font.js" type="text/javascript" ></script> <!--[if lt IE 7]> <link href="ie_style.css" rel="stylesheet" type="text/css" /> <![endif]--> </head>
- ベストアンサー
- その他([技術者向] コンピューター)
お礼
お礼が遅くなってすいません。 下記はリンクされているようで、jsは開きます。 <!-- - ここから JavaScript 記述です。 - --> <script src="../Public\javascripts/spinelz/grid.js" type="text/javascript"></script> <script src="../Public\javascripts/spinelz/grid_resizeEx.js" type="text/javascript"></script> <script src="../Public\javascripts/spinelz/grid_sortabletableEx.js" type="text/javascript"></script> <!-- - ここまで JavaScript 記述です。 - --> もう少し探ってみます。 ありがとうございました。