• 締切済み

jsについて

html外部jsファイルを読むとき1行目と2行目違う内容を同時読み取る場合どうしたらいいですか html <html> <head> <meta http-equiv="content-type" content="text/html;charset=Shift_JIS"> <style media="screen" type="text/css"></style> <SCRIPT type="text/javascript" src="1.js"></SCRIPT> <body bgcolor="aliceblue" onLoad="dismsg1(0)"> <SCRIPT language="Javascript"> <!-- //イメージ、文章の切り替え function dismsg1(num){ document.all("mymsg").innerHTML=eval("msg"+[num]); document.all("mymsg1").innerHTML=eval("msg"+[num]); }; // --> </SCRIPT> <div id="mymsg"></div> <div id="mymsg1"></div> </body> </html> jaデータ var msg0="<font style='color:#800000;font-size:10pt'> 一行目</font>"; var msg1="<font style='color:#800000;font-size:10pt'> 二行目</font>"; ブログラム終了 上記の場合は"一行目"二回繰り返し表示するだけ msg1とmag2の内容を一行目と二行目表示したいです よろしくお願いします

みんなの回答

  • cero_d
  • ベストアンサー率87% (14/16)
回答No.1

<div id="mymsg"></div> これに0追加で <div id="mymsg0"></div> こうして var msg0="<font style='color:#800000;font-size:10pt'> 一行目</font>"; var msg1="<font style='color:#800000;font-size:10pt'> 二行目</font>"; これを var msg = ["<font style='color:#800000;font-size:10pt'> 一行目</font>","<font style='color:#800000;font-size:10pt'> 二行目</font>"]; に変えて function dismsg1の document.all("mymsg").innerHTML=eval("msg"+[num]); document.all("mymsg1").innerHTML=eval("msg"+[num]); これを for (var i in msg) { document.all("mymsg"+i).innerHTML=msg[i]; } こうすれば出来ますよ

関連するQ&A

  • JSの記述を別ファイルに移す

    下記のHTML内の <script type="text/javascript">~</script> をtest.jsとして別ファイルに移す場合にどのように、記述するればよいのでしょうか。単純にコピペしたのですがうまくいきません。 初歩的だとは思いますが、ご指導をお願いします。 --------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/Draggable.js"></script> </head> <body> <div id="test1" class="test"></div> <div id="test2" class="test"></div> <script type="text/javascript"> var test1 = new Draggable("test1"); var test2 = new Draggable("test2"); </script> </body> </html>

  • prototype.js で $ is not defined になってしまう!

    JSバージョン:prototype1.6 ブラウザ:Firefox2.0、IE7.0 OS:WinXPpro でシンプルに <html> <head> <title>$ - 指定idのエレメントを取得</title> </head> <script type="text/javascript" src="/js/prototype.js?aaads"></script> <script type="text/javascript"> function test1() { var element = $('div1'); alert(element.innerHTML); } </script> <body> <div id="div1">DIV1の中身</div> </body> </html> を実行したところ、$ is not defined と エラーになってしまいます。 あるレンタルサーバにUPして動かすと問題なく、 ローカルPCで実行するとエラーになってしまうようです。 どなたか教えて下さい!!!

  • アメブロで外部ファイル(js)を読み込みたい

    アメブロで、プラグインの文字数を節約するため サーバーに外部ファイル(jsファイル)を置き、読み込みたいのですが 参考サイトの記事を読んで、同じように書いても出来ません。。 一つ一つの記事の上に、メッセージが出るようにしたいのですが 反映されず・・・ 反映されないブログ⇒ http://ameblo.jp/webtest04/ サーバーにUPしたjsファイルには、以下のように書きました。 //全ページにメッセージボード設置 //http://ameblo.jp/exlink/entry-10241077474.html var myTm ='ここにタグを書いてください' //http://ameblo.jp/exlink/ function myT() { var myObj = document.getElementById('main'); myObj.innerHTML = ( '<div id="tme">'+ myTm + '</div>') + myObj.innerHTML;} //記事下に定型文を自動挿入 //http://ameblo.jp/exlink/entry-10163916334.html var myMe ='ここにタグを書いてください' //http://ameblo.jp/exlink/ function myF() { var myfix = document.getElementsByTagName('div'); for(i = 0; i < myfix.length; i++){ myObj=document.getElementsByTagName('div')[i]; if(myObj.className=='contents'){ myObj.innerHTML += ( '<p class="fix">'+ myMe + '</p>');}}} そして、アメブロのプラグインの方には、以下のように書きました。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script> <script type="text/javascript" src="http://wt01.web.fc2.com/plugin.js"></script > <script language="javascript"><!-- window.onload = function(){ myT(),myF();} // --></script> --------------------------- どなたか、原因がわかる方はいらっしゃいますか? よろしくお願いいたします。

  • 外部ファイル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のinnerHTMLの挙動について

    下で"JavaScript内からJavaScriptを書き出したいのですが"で質問したものですが,ソースコードを簡単にして再質問したいと思います. ソースは以下のようにし,divタグのところにinnerHTMLで文字"test"とJavaScriptでアラートを表示させるものです.表示してみたところ,"test"は表示されるのですが,アラートは出てきません. これはinnerHTMLではHTMLのタグは評価されるが,JavaScriptは評価されない,ということなんでしょうか.JavaScriptのこのような仕様は調べにくいので困っています.回答宜しくお願いします. <html><head><title></title> <SCRIPT type="text/javascript"> <!-- var str='<font color="blue">test</font><script type="text/javascript">alert(123);</script>'; function gogo(){ document.all("here").innerHTML = str; } //--> </SCRIPT> </head><body> <div id="here" style="position:absolute;width:600px;left:0px;top:0px;"></div> <SCRIPT type="text/javascript"> <!-- gogo(); //--> </SCRIPT></body></html>

  • フレーム分割すると動かない

    以下のように選択された罫表内のセルの線種を変更するボタンを作りました。 1つのhtmlの時は上手くいっていたのですが、以下のようにボタンと罫表のフレームを分割した所、動かなくなってしまいました。 グローバル変数が引き継がれないみたいなのですが、解決方法ありますでしょうか。 宜しくお願いします。 //メインのhtml <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="sample_csv2.js"></script> </head> <frameset rows="50,*" frameborder="0" border="0"> <frame src="fre1.html" name="f1"> <frame src="fre2.html" name="f2"> </frameset> </html> //フレーム1のhtml <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="sample_csv2.js"></script> </head> <body> <div style="font-size:6.5pt"> 線種変更: <input type="button" value="上2" onclick="chgLine('top','double')" style="font-size:6.5pt"/> </div> </html> //フレーム2のhtml <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="sample_csv2.js"></script> </head> <body> <table tno=1 style='border:none;border-collapse:collapse'> <tr> <td style='width=100.0pt;border:solid windowtext 1.0pt; padding:0mm 4.95pt 0mm 4.95pt'> <p style='font-size:10.5pt;mso-bidi-font-size:10.5pt; font-family:"MS 明朝"'>あいうえお</p> </td> <td style='width=100.0pt;border:solid windowtext 1.0pt;padding:0mm 4.95pt 0mm 4.95pt'> <p style='font-size:10.5pt;mso-bidi-font-size:10.5pt; font-family:"MS 明朝"'>かきくけこ</p> </td> </tr> <tr > <td style='width=100.0pt;border:solid windowtext 1.0pt;padding:0mm 4.95pt 0mm 4.95pt'> <p style='font-size:10.5pt;mso-bidi-font-size:10.5pt; font-family:"MS 明朝"'>たちつてと</p> </td> <td style='width=100.0pt;border:solid windowtext 1.0pt;padding:0mm 4.95pt 0mm 4.95pt'> <p style='font-size:10.5pt;mso-bidi-font-size:10.5pt; font-family:"MS 明朝"'>なにぬねの</p> </td> </tr> </table> </body> </html>

  • js 引用符

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <div id="a"></div> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="moment.js"></script> <script src="fastclick.js"></script> <script> $(function(){ var retinaSwitch = window.<span class="searchword">devicePixelRatio</span>; if(retinaSwitch == 1) { $('#container').html('Retinaディスプレイではありません'); } else if(retinaSwitch == 2) { $('#container').html('Retinaディスプレイです'); } }); </script> </body> </html> javascriptのコードなのですがWebサイトからコピペした文章が上手く反映されません。引用符関係のイージーミスだとは思うのですが、ちょっとドツボに嵌っているので、ご指摘頂ければと思います。

  • jsでプルダウンで選択したものがうまく表示されない

    以下のhtml文があります。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function onButtonClick() { var val = document.forms.form1.textBox1.value; var target = document.getElementById("output"); if (val == "Penguin") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form action="" id="form1"> <div>"Penguin"と入力してください。</div> <input id="textBox1" type="text" value="" /> <input type="button" value="Exec" onclick="onButtonClick();" /> </form> <div id="output"></div> </body> </html> Penguinと入力すると合っていますと表示が出ます。 これを、プルダウン方式にしました。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function selectboxChange() { var val1 = document.forms.form1.Select1.value1; var target = document.getElementById("output"); if (val1 == "要素1") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1" onchange="selectboxChange();"> <option>---</option> <option value1 == "要素1">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output"></div> </body> </body> </html> これにすれば、要素1を選択すれば、会っていますと表示されるのですが、されません。 どうしたら改善されますか。

  • prototype.jsを利用したイベントの登録について

    はじめまして。 現在 prototype.js 1.4.0 を利用して、Web ページの作成を行っているのですが、イベントの登録 (Event.observe)でやりたいことと、異なる動作になってしまい困っているところです。 [ やりたいこと ] javascript側で動的に生成した各要素 (div) に対して moueover & mouseout のイベントを割り当てる。mouseover 時には background の値を変え mouseout 時には background の値を元(transparent)に戻す。 [ 困っていること ] 各要素のmouseover & mouseout 時には各要素の背景色が変更されるはずなのに、一番最後に生成した要素の背景が変更されてしまう。 [ コード ] <html> <head> <script type="text/javascript" src="prototype.js" ></script> <script type="text/javascript"> view = new Class.create(); view.prototype = { initialize:function() { var view = $('viewContents'); var idName = 'test'; for (var i=0; i<10; i++) { var id = idName + i; var d = document.createElement('div'); d.id = id; d.innerHTML = id; view.appendChild(d); Event.observe(d,'mouseover',function() {d.style.background='#aaa';}.bind(this),false); Event.observe(d,'mouseout' ,function() {d.style.background='transparent';}.bind(this),false); Event.observe(d,'click' ,function() {alert(d.id);}.bind(this),false); } } } </script> </head> <body> <p><input type="button" onclick="new view();" value="取得"></p> <div id="viewContents"></div> </body> </html> となります。 なにか基本的なところが間違っているのでしょうか? よろしくお願いいたします。

  • overflowを使ってのスクロール

    CSSのoverflowを使って、ページの一部をスクロールさせたいのですが 完全に下までスクロールができません。 具体的には以下のソースの"div2"をスクロールさせたく、overflowのauto を使っているのですが、一番下までスクロールができません。 どのようにしたらよいか、ご指摘お願いいたします。 HTMLのソースは以下の通りです。 このままコピペしてもらえば動作を確認してもらえると思います。 どうかよろしくお願いいたします。 <html> <head> <style type="text/css"> body { overflow: hidden; } div { border: 1px solid black; } #div2 { height: 100%; overflow: auto; } </style> </head> <body> <div id="div1"></div><br> <div id="div2"></div> </body> <script type="text/javascript"> var text = ""; for (var i=0; i<10; i++) text += "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>"; document.getElementById('div1').innerHTML = text; for (var i=0; i<150; i++) text += "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>"; document.getElementById('div2').innerHTML = 'BEGIN<br>' + text + 'END'; </script> </html>

    • ベストアンサー
    • CSS