pc.casey.jp » JavaScript

pc.casey.jp » JavaScript http://pc.casey.jp コンピュータに関する記述とメモ Wed, 08 Feb 2012 01:21:06 +0000 ja hourly 1 http://wordpress.org/?v=3.3.1 フローティングポップアップを閉じる http://pc.casey.jp/archives/2448 http://pc.casey.jp/archives/2448#comments Mon, 16 Aug 2010 02:49:53 +0000 admin http://pc.casey.jp/?p=2448 以前紹介したフローティングポップアップ： pc.casey.jp » jQuery を使ったフローティングポップアップ : http://pc.casey.jp/archives/2441 どうしてか、自力で閉じようとしてかなりハマる。配布元に有益な情報がきっちり書かれていたのに…。ということで、閉じたり開いたりする方法のメモです。 ※IFRAMEの場合開く <a href="（開きたいアドレス）" onclick="new $pop( this.href, { type: 'iframe', title: 'test', width: 900, height: 400, varName: 'hoge' } ); return false;">iframeTest</a> この時、varName: ‘hoge’ のように名前をつけておくと、とても幸せになれる。閉じる開いたところ（親）から <a href="javascript:;" onclick="test(); return false;">CloseTest</a> function test(){ hoge.close(); } 開かれたところ（子）から parent['hoge'].close(); この記事を読んだ人は、こんな記事にも興味をもっていますつぶやくボタンの設置 – JavascriptjQuery を使ったフローティングポップアップ]]> http://pc.casey.jp/archives/2448/feed 0 jQuery を使ったフローティングポップアップ http://pc.casey.jp/archives/2441 http://pc.casey.jp/archives/2441#comments Sun, 15 Aug 2010 23:40:53 +0000 admin http://pc.casey.jp/?p=2441 jQuery を利用してフローティングポップアップを行うライブラリ。ライセンスはMITライセンス。内容は多彩であり、デザインもよい。使用するだけでワンランク上のシステムに感じる（かも） ◆CakePHPから利用する場合 ◇CSS内を書き換える：前：　background: url(image/pw_tbar_l.png) left top no-repeat; 後：　background: url(‘../../img/popupwindow/pw_tbar_l.png’) left top no-repeat; ◇Viewのサンプル： echo $html->css(‘popupwindow/popupwindow’); echo $javascript->link(‘popupwindow/jquery-1.2.6.min’); echo $javascript->link(‘popupwindow/popupwindow-1.8.1′); <a href=”/items/select” onclick=”new $pop( this.href, { type: ‘iframe’, title: ‘test’, width: 900, height: 400 } ); return false;”>iframeTest</a> <a href=”javascript:;” onclick=”new $pop( ‘ModalTest’, { type: ‘alert’, title: ‘ModalTest’, modal: true } );”>ModalTest</a> ◆参考文献・デモサンプル：ポップアップウィンドウ [...]]]> http://pc.casey.jp/archives/2441/feed 0 [Javascript] Selected を変更する http://pc.casey.jp/archives/2437 http://pc.casey.jp/archives/2437#comments Sun, 15 Aug 2010 22:51:34 +0000 admin http://pc.casey.jp/?p=2437 Javascript で Selected を変更するただのメモ。やりたい事は単純で、Select のID （＝SaleItemId）と、選択させたいValue （＝55）を渡すと、そのようにしてくれるというタダのそれだけ。 HTMLのサンプル： <select name="data[Sale][item_id]" id="SaleItemId"> <option value="53">ウィルス対策ソフトＡ</option> <option value="51">パソコン本体Ａ</option> <option value="52">パソコン本体Ｂ</option> <option value="54">ウィルス対策ソフトＢ</option> <option value="55">マウス</option> <option value="56">キーボード</option> </select> 呼び出し部のサンプル： echo '<a href="#" onClick="selectedChange(\'SaleItemId\', 55);">test</a>'; Javascript のサンプル： <SCRIPT language="JavaScript">  <script src="./svcheck.js"></script> <script language="javascript"> // check server list // { serverName : http://yourdomain.com } var go = { [...]]]> http://pc.casey.jp/archives/1536/feed 0 [Javascript] ウェブサイトにあらゆる検索を控えめに設置する- popIn http://pc.casey.jp/archives/825 http://pc.casey.jp/archives/825#comments Mon, 29 Mar 2010 09:49:27 +0000 admin http://pc.casey.jp/?p=825 何気なくニュース記事（神奈川県に「会計Ｇメン」新設　不正経理チェック – 47NEWS（よんななニュース））を見ていたら、面白いスクリプトが実装されていることに気がついた。こういったスクリプトはMSNなどにも搭載されているが、Javascriptを駆使していると言うか非力な筆者のマシンでは他のソフトウェアに与える影響も少なくなく、そういう理由で見ることを控えてしまうこともある。このスクリプトは動作がそれらに比べて軽いのか、重いと感じることはなかった。またブラウザのアドオンとして動作させることもできるし、任意のサイトで動作を禁止することもできるようだ。各種アフィリエイトプログラムにも対応しているようで、IDを設定出来る項目もあるため、収益を得ることも可能らしい。公式サイトやスクリプトにまだ問題があるようで一部の機能は正しく動作しない。しかし、これらは仕様かもしれない。現在のところ自分で設置してみてはいないのでメモ程度に書き記しておく。動作イメージ ▼以下の記事を読んでいたわけです ▼何となく選択したのです ▼上記の「Wikipedia」にマウスカーソルを持っていくと、さらにメニューが出た ▼試しにGoogle検索をクリックしてみる。別ページに飛ばされるかと思ったら内部で表示してくれたのは嬉しかった。 ▼そのまま右上矢印をクリックすると、新しいタブで開くことができる。ウィンド内の機能も充実している ▼検索を切り替えることができる（Google検索＝最初にメニューで選択したもの） ▼Google検索内でもウェブや画像などを切り替えることができる ▼右下のウィンドで検索を切り替えることができる（Wikipediaをクリックしてみる。ちょっと呼び出しに問題があるらしい） ▼Google翻訳に切り替えてみる ▼YouTube検索に切り替えた ▼Amazon検索に切り替えた設定項目は以下の通り <script language="javascript"> <!-- var _popIn_id = "あなたのpopIn ID"; //変更不可 var _popIn_blogUrl = "サイトURL(例：http://blog.popin.cc)";//変更不可 var _popIn_ads = "クリック広告の有効・無効(例：true)"; var _popIn_skin = "スキンカラー(例：black)"; var _popIn_width = ウィンドウの横幅(例：400); var _popIn_height = ウィンドウの縦幅(例：400); var _popIn_keyword_max = キーワード最大表示表示個数(例：5); var [...]]]> http://pc.casey.jp/archives/825/feed 0 JavaScriptで外部サイトアクセス不能を回避する http://pc.casey.jp/archives/818 http://pc.casey.jp/archives/818#comments Sun, 28 Mar 2010 17:49:32 +0000 admin http://pc.casey.jp/?p=818 JavaScriptで、サブドメインが異なるとか、ドメインが異なるサイトの情報を取得しようとすると、できない。同一のスクリプトをローカルから実行することはできるが、ウェブサーバーに載せて呼び出すと実行できない。もちろん、セキュリティー対策（クロスサイトスクリプティング対策）が動作しているためであるから、その設定を変更すれば問題なく動作させることができるが、そんな操作をユーザーがやってくれるとは思えない。このような場合、内部に別のシステムを作っておき、そのプログラムが外部サイトの情報を取得し、JavaScriptへ返答を返すように作る必要がある。だが、面倒だ。面倒だったから少し前に書いたスクリプトを破棄して前のバージョンに戻した経験があったのだけれど、全く別の調べ物をしている時にこの問題を簡単に解決してくれるものを見つけた。プロキシを設置する、ということだった。考え方としては全く同じだけれど、まず「プロキシ」という言葉を聞かされたときに、あぁそっか、その手があったな、いわれてみればそうだ、と思った点、汎用的に利用できる用になっている点、ライセンスがGPL and MITでオープンソースな点、いくつかのサイトで取り上げられている点でなかなかよさそうだ。しかし、私の使いたい用途は単純で、指定されたURLにアクセスできるかどうかを判定したいのだ。要は404か200かだけわかればいいのだ。これらのツールで404の場合、ステータスフィールドに返答が返されそうだが、今のところ試していない。とりあえずメモ。 ◆参考文献 JavaScriptでどうしても外部のドメインのコンテンツを読みたい際に使えるプロキシスクリプト「Simple PHP Proxy」:phpspot開発日誌 : http://phpspot.org/blog/archives/2010/01/javascriptsimpl_3.html Simple PHP Proxy: Get external HTML, JSON and more! : http://benalman.com/code/projects/php-simple-proxy/docs/files/ba-simple-proxy-php.html Ben Alman » Simple PHP Proxy: JavaScript finally “gets” cross-domain! : http://benalman.com/projects/php-simple-proxy/ クロスドメインの制約を外す事ができるproxy「Simple PHP Proxy」 | Web活メモ帳 : http://blog.verygoodtown.com/2010/01/cross-domain-proxy-php-script-simple-php-prox/ この記事を読んだ人は、こんな記事にも興味をもっていますサブドメイン間のCookie]]> http://pc.casey.jp/archives/818/feed 0 JavascriptでCookieを簡単に扱うライブラリ「Cookie Manager」 http://pc.casey.jp/archives/633 http://pc.casey.jp/archives/633#comments Thu, 04 Mar 2010 21:45:52 +0000 admin http://pc.casey.jp/?p=633 JavascriptでCookie扱うためのサンプルはたくさん見つけたものの、どれも扱いにくい。仕方なく自分で作るかと思ったときに、ライブラリを探してみようと思った。そこで発見したのが「CookieManager」。これを使うことにした。確認した範囲ではCookieManagerは日本語が扱えたほか、読み出し、書き込みが簡単に行え、有効期限の設定も可能だった。 ◆参考実装 ◇HTML <script language=”javascript” src=”/js/prototype.js”></script> <script language=”javascript” src=”/js/cookiemanager.js”></script> ◇js var manager = new CookieManager(); window.onload = function() { for(var t=0; t<ids.length; t++) if(manager.getCookie(ids[t])){ document.getElementById( ids[t] ).value = manager.getCookie( ids[t] ); } } function checkSubmit(){ for(var t=0; t<ids.length; t++){ manager.setCookie(ids[t], document.getElementById( ids[t] ).value); } } ◆関連投稿 pc.casey.jp » CakePHPでbody onloadを使う : http://pc.casey.jp/archives/627 ◆参考文献 [JavaScript] [...]]]> http://pc.casey.jp/archives/633/feed 0