• ベストアンサー

javascriptを別ファイルにして、HTMLファイルから呼び出したい

4つのリンクがあり、 それぞれサイズを指定して小窓を出したいと思い 調べたら以下のソースがありましたので、出来ました。 <a href="javascript:void(0);" onclick="window.open('表示するペ-ジのURL','○○', 'width=横サイズ,height=縦サイズ,resizable=リサイズボックス有無,menubar=メニュ-バ-有無,status=ステ-タスバ-有無,location=ロケ-ションバ-有無,scrollbars=スクロ-ルバ-有無,toolbar=ツ-ルバ-有無,');">リンク1</a> これをHTMLファイルに直接入れるのではなく JavaScriptファイルとして別にしたいのと、 HTMLファイルで「リンク1」という文字にそのJavaScriptを適用(呼び出す?)するには、どうしたらいいのでしょうか? 「リンク1」「リンク2」「リンク3」… と、リンク先はそれぞれです。 よろしくお願いいたします。

noname#53881
noname#53881

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

  • ベストアンサー
  • leap_day
  • ベストアンサー率60% (338/561)
回答No.6

こんにちは あぁ~なるほど htmlファイルをクリックして表示させてるんですね? それでしたら「セキュリティー保護の為~~」のバーをクリックして 「ブロックされているコンテンツを許可」 「セキュリティーの警告 このファイルでアクティブコンテンツを実行しますか?」を「はい」にすればとりあえずは見れると思いますけど・・・

その他の回答 (5)

  • leap_day
  • ベストアンサー率60% (338/561)
回答No.5

こんにちは こういう感じのもの? [test.js] window.onload = function() { link1 = document.getElementById("a1"); link1.href = "javascript:win('test0.html','500','300')"; link2 = document.getElementById("a2"); link2.href = "javascript:win('test1.html','600','600')"; link3 = document.getElementById("a3"); link3.href = "javascript:win('test2.html','300','300')"; } function win(url,width,height) { window.open(url,'win1',"width="+width+",height="+height+",resizable=no,menubar=no,status=no,location=no,scrollbars=no,toolbar=no"); } [html] <script type="text/javascript" src="./test.js"></script> <a id="a1"> リンク1</a> <a id="a2"> リンク2</a> <a id="a3"> リンク3</a> No.3様のやってみましたが出来るようですね~~ 何が違うんだろう? 『それぞれサイズ指定』とあったので投稿しましたので解決したら組み合わせて使ってみてください (僕のはステータスバーに色々情報が出ますので・・・ javascript:win('test2.html','300','300'); のように)

noname#53881
質問者

補足

ありがとうございます~~ あれ?出来ました?? それでは、こちらのPCの設定か何かでしょうか・・・ HTMLファイルを開くと 「セキュリティ保護のため、~~~」 という黄色いバーが上に出てきますが、 「ブロックされているコンテンツを許可」 を選べば出来るはずですよね? それでも リンク1 リンク2 リンク3 と横並びになってるだけになっちゃいます・・・ お忙しい中、本当にすみません・・・

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.4

コピペしましたね? この掲示板からコピーしたものを張るとごみがつくようです。 openWindow("ttp://・・・") のところを一度削除した上で手入力でうちなおしてください・・・・

noname#53881
質問者

補足

ごめんなさい~ コピペしました。 メモ帳にコピペしてからまたコピペしたんですけどダメなんですね・・・ とりあえずすべて手打ちしたら、すんなり保存できました^^ ありがとうございました。 でもHTMLの方でリンクが貼れてないんです。 文字だけ出てます。 HTMLとJSファイルは同じディレクトリです。 難しいというより何故なのか全くわかりません… わかる方ってすごいですね。

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.3

javascriptを完全に外部にわかるのであればidを振って処理します。 //html <html> <head> <script type="text/javascript" src="test.js"></script> </head> <body> <a id="link1">リンク1</a> <a id="link2">リンク2</a> <a id="link3">リンク3</a> </body> </html> //test.js window.onload=function(){ var link1=document.getElementById('link1'); link1.setAttribute("href","javascript:void(0);"); link1.onclick=function(){openWindow("http://www.yahoo.co.jp")}; var link2=document.getElementById('link2'); link2.setAttribute("href","javascript:void(0);"); link2.onclick=function(){openWindow("http://www.google.co.jp")}; var link3=document.getElementById('link3'); link3.setAttribute("href","javascript:void(0);"); link3.onclick=function(){openWindow("http://www.goo.ne.jp")}; } function openWindow(url){ newWin=window.open(url,'newWin','width=800,height=600,resizable=no,menubar=no,status=no,location=no,scrollbars=no,toolbar=no'); newWin.focus(); }

noname#53881
質問者

補足

できそう! …と思いましたができませんでした(涙) リンク1 リンク2 リンク3 にリンク貼れてなかったです。 text.jsを作成して保存するとき 「現在のエンコーディングではドキュメント内のすべての文字を正しく保存できません。UTF-8 またはこのドキュメント内の特殊文字をサポートするエンコードに変更してください。」 というのが出ました。 機種依存文字さがしましたが、なさそうなんですけど?? 何かおかしいのでしょうか? 何度もすみません。よろしくお願いします。

noname#39970
noname#39970
回答No.2

>JavaScriptファイルとして別にしたい <script src="script.js"></script>

noname#53881
質問者

補足

その中身というか… リンク一つ一つありますので その一つ一つの呼び出し方がわからなかったんです。 ありがとうございました。

  • asx
  • ベストアンサー率50% (27/54)
回答No.1

◆JavaScriptファイル function fnc_open(file) { window.open(file, 'title', 'width=100, height=100, menubar=no, toolbar=no, scrollbars=yes'); } ◆HTML <a href="javascript:fnc_open('link1.html');">リンク1</a> <a href="javascript:fnc_open('link2.html');">リンク2</a> <a href="javascript:fnc_open('link3.html');">リンク3</a> こんなかんじで、「fnc_open('****')」の****部分にそれぞれファイル名を指定すればできます。

noname#53881
質問者

お礼

ありがとうございまいた。 ウィンドウサイズが全部同じでしたらこれでよかったかもしれないのですが、ウィンドウのサイズもそれぞれなんです。 すみません。 でも勉強になりました。

関連するQ&A

  • 教えてほしいのですが・・・。

    ブログで同じ記事内で、新しいウインドウ小窓を出したいのですが、 <a href="#" onclick="window.open('表示するペ-ジのURL','miniwin', 'width=横サイズ,height=縦サイズ,menubar=メニュ-バ-有無,toolbar=ツ-ルバ-有無,locaction=ロケ-ションバ-有無,scrollbars=スクロ-ルバ-有無,status=ステ-タスバ-有無,');">文字</a> ↑これだと小窓が出てくれません。 そして、 <a href="#" onclick="window.open('表示したいページのURL','ウィンドウ名','width=横,height=縦');">文字</a> ↑にすると、小窓が出てくれますがスクロールバーが表示されません。 スクロールバーを表示したいのですがどういうタグを使えばいいのでしょうか?

  • 外部からのjs呼び出しについて。

    はじめまして。 最近、ジャバスクリプトを外部から呼び出せる事を知りました。 私が作成したHPは小窓表示が多のですが 小窓を表示させるリンクを作成のたび、長いタグを使っていると正直萎えてしまうのです。 なので、外部からスクリプトを呼び出せば長いタグを打つ手間が省けると考えました。 しかし、試したものの動かず… .jsのシートに表記したのは以下のタグ。 function win1(){ window.open('○.htm','chip',' resizable=リサイズボックス有無,menubar=メニュ-バ-有無, status=ステ-タスバ-有無,location=ロケ-ションバ-有無, scrollbars=スクロ-ルバ-有無,toolbar=ツ-ルバ-有無, width=窓の横幅,height=窓の縦幅');} ・function win1()の1の番号は2つ以上の小窓を出す為、リンクのウィンドウ番号です。 Htmlファイル<head>~</head>の間には以下のタグ。 <script type="text/javascript" src="○○.js"></script> Htmlファイル<body>~</body>の間に書いたリンクのタグ。 <a href="javascript:win1()">小窓のリンク</a> ・javascript:win1()←の1の番号は表示させる小窓の番号。 以上のように表記しているのにエラーが出てしまい全く動かないのです。 現在Microsoft Front Pageで作成しているのですがタグを打ち終わりプレビューを押すと ライン:4 文字:35 エラー:終了していない文字列型の定数です。 コード:0 又、.jsのファイルを開こうとダブルクリックすると 行3 文字35 エラー:終了していない文字列型の定数です。 コード:800A03F7 ソース:Microsoft JScriptコンパイルエラー と出てきます。 “ジャバスクリプト部分のタグにエラーが発生してるんだろな”と言う事は分かるのです。(当たり前) でも、何が悪いか全く分からずお手上げ状態なのです。 どれだけ直しても同じエラーばっかり。本当に困っています… 皆様の力を貸していただけたらと思います。 よろしくお願いします。

  • Javascriptを使わないで別窓

    サイトの作成で、現在以下のjavascriptを使用したつくりになっているんですが、 function subWin1(){ window.open("top_ss.htm","lunanueva","resizable=no,menubar=no,directories=no,status=no,location=no,scrollbars=yes,toolbar=no,width=800,height=620");} ※ステータスバーとか消した別窓を出すjavascript Javascriptを使用せず、ステータスバーを消す別窓など、それに近いことを行うことはできないでしょうか。

    • ベストアンサー
    • HTML
  • 開かれる側のファイルに、ツールバー非表示記述

    開かれる側のファイルに、ツールバー非表示やウィンドウサイズ指定などの記述をしたいのですが("width=300,height=400,menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=yes,resizable=yes"など?)、どう記述したらよろしいでしょうか。よろしくご回答のほど、お願いいたします。

  • JavaScriptでwindowopenを使用したとき

    ホームページビルダー7を使ってHP作成中ですが、JavaScriptでwindowopenを使用してページを表示することまでは出来たんです(一晩もかけて(T_T))プレビューでは表示されますがサイトを転送してみるとリンクされていません。ビルダーの「サイトのビジュアルを開く」で見てみてもやはりリンクされていません。タグが間違っているのでしょうか?ファイルはもちろん同じフォルダにあります。 <SCRIPT Language="JavaScript"> <!-- function nwn(url) { w = window.open(url, 'win01','width=350,height=600,status=0,scrollbars=1,directories=0,menubar=0,resizable=1,toolbar=0');} //--> </SCRIPT> <A HREF="javascript:nwn('link.htm')">○○○○</A>です。 ビルダーのプレビュー画面で、リンクされている文字や画像の上にマウスを乗せると画面上部にリンクされているファイル名が表示されますが、リンクがうまくいかないこの分に関してはマウスを上に乗せると javascript:nwn('link.htm')と表示します。 どなたかアドバイスお願いいたします。(T_T)/~~~

  • HP、リンク先を最大化で開く方法は?

    ホームページ作成講座・作成支援サイト『ともくんの部屋』(http://www4.ocn.ne.jp/~tomotan/)のページを参考に、下記のようにHTMLを書いたのですがうまくいきません。 <INPUT type="button" value="リンク先を最大化して開く" title="リンク先を新しいウィンドウで最大化して開きます" onClick="window.open('….html','','toolbar=yes,menubar=yes,location=yes,status=yes,scrollbars=yes,resizable=yes'); moveTo(0,0); resizeTo(screen.availWidth,screen.availHeight);"> 最大化されずに開くのですが、どこがいけないのでしょうか? また、自分が思うには、,'','toolbar=yes,menubar=yes,location=yes,status=yes,scrollbars=yes,resizable=yes'); moveTo(0,0); この部分はなくてもよいと思うのですか、消すとエラーを起して動きません。 このHTMLの構造についても教えて下さい。よろしくお願い致します。

    • ベストアンサー
    • HTML
  • java script作ったのですがうまく出来ません 1

    下記のを作成したのですがウインドウが3つめまでしか開きません。 ご指摘お願いします。初心者です。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT LANGUAGE="JavaScript"> function window_open(){ w1 = window.open("http://www.yahoo.co.jp/", "_blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes"); w2 = window.open("http://www.yahoo.co.jp/", "_blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes"); w3 = window.open("http://www.yahoo.co.jp/", "_blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes"); w4 = window.open("http://www.yahoo.co.jp/"," _blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes"); w5 = window.open("http://www.yahoo.co.jp/", "_blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes"); w6 = window.open("http://www.yahoo.co.jp/", "_blank", "dependent =yes,alwaysLowered=yes,directories=yes,location=yes,scrollbars=yes,status=yes,toolbar=yes,resizable=yes,menubar=yes");

  • 別ウインドウを開くようにしてるのですが

    こんにちは HPで画像を開く際に、下のようなjavascriptを使っています。 <SCRIPT Language="JavaScript"> <!-- function openwin(url) { /* 横幅400px、縦幅200pxのウインドウを開く */ w = window.open(url, 'win','width=400,height=200,status=no,scrollbars=yes,directories=no,menubar=no,resizable=yes,toolbar=no'); } //--> </SCRIPT> body部分に <a href="javascript:openwin('abc.htm')">いろは </a> としています。 で、お教え願いたいのは、別のサイズのウインドウにしたいときはどうしたらいいのでしょうか? 普段は400×200でいいのですが、たまに400×400にしたいときがあります。 方法を教えてくださいませ よろしくお願いいたします。

  • ブラウザサイズをフルサイズで表示させる方法

    ブラウザにタイトルバーとスクロールバーとスタートバー以外を表示しないページを作成したいのですが、 XPはOKで、WIN98でうまくいきませんでした。リンク先をクリックすると別ウィンドウが立ち上がる仕組みです。画面サイズに合わせて変わるようなのですが、WIN98では、スクロールバーが途中で切れてしまい、 一番下まで、綺麗に表示できませんでした。これ以外の方法でもかまいませんので、どなたかご伝授いただければと思います。 function wopen(url){ if(screen.width <= 640){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=640,height=480,left=0,top=0") }elseif(screen.width <= 800){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=800,height=600,left=0,top=0") }else if(screen.width <= 1024){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1024,height=768,left=0,top=0") }else if(screen.width <= 1152){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1152,height=864,left=0,top=0") }else if(screen.width <= 1280){ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1280,height=1024,left=0,top=0") }else{ window.open(url,"_blank","resizable=no,menubar=no,status=yes,location=no,scrollbars=yes,toolbar=no,width=1600,height=1240,left=0,top=0") } return; } : <A href="javascript:wopen('/index.html')">

  • 別窓を開くリンクでリンク元に画像を使用したいのですけども・・・

    いつもお世話になります。 また、問題が発生致しました。 javaScriptで別窓を開くリンクでリンク元に画像を利用したいのですけども検索しても文字からのリンクしか見つからず画像からのリンクを教えて頂きたいのですが、よろしくご指導お願い致します。 <SCRIPT LANGUAGE="JavaScript"> <!--- function wopen1(){ window.open("http://www.yahoo.co.jp","yahoo", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,width=500,height=300") } //---> リンク元で画像を使いたいです。 <A HREF="javascript: wopen1()">ウィンドウ1</A> これをどのように書き換えれば画像からリンクできますでしょうか? お手数かけますがお願いいたします。