- ベストアンサー
外部ファイルの参照の仕方
現在、外部ファイルに記述されたプログラムを参照するコードを書いているのですが、うまく実行できません。以下のコードなのですが、書き方が間違っているようでしたら、教えてください。 プログラムの内容としては、キューへの操作で、pushは値を格納、popは最小値を取り出す、peak最小値を参照する、という機能を提供しています。 （外部ファイル：PriorityQueue.js） function PriorityQueue(){ var queue=[]; var queue2=[]; } PriorityQueue.prototype.push = function (value){ queue.push(value); queue.sort(); queue.sort(function(queue,queue2) { return queue-queue2; }); } PriorityQueue.prototype.pop = function(){ var pop=queue.shift(); return pop; } PriorityQueue.prototype.peak =function(){ var peak= queue.shift(); queue.push(peak); queue.sort(); queue.sort(function(queue,queue2) { return queue-queue2; }); return peak; } } 参照元ファイル： <html><head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script src="PriorityQueue.js"></script> <script> var q = new PriorityQueue(); function doPush() { var val = document.driver.push.value; q.push(val); var log = document.getElementById("log"); log.innerHTML += "push(" + val + ")\n<br/>"; } function doPop() { var val = q.pop(); var log = document.getElementById("log"); log.innerHTML += "pop() -> " + val + "\n<br/>"; } function doPeek() { var val = q.peek(); var log = document.getElementById("log"); log.innerHTML += "peek() -> " + val + "\n<br/>"; } </script> </head><body> <form name="driver"> <input type="text" name="push"> <input type="button" value="Push" onclick="doPush();"> <br/> <td><input type="button" value="Pop" onclick="doPop();"> <br/> <td><input type="button" value="Peek" onclick="doPeek();"> </form> <span id="log"></span> </body></html>
- ny_cs
- お礼率53% (17/32)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
・ 以下のコードを参考にしてみてください。 ------------------------------------------------------------ PriorityQueue.js ------------------------------------------------------------ function PriorityQueue() { this.queue = []; this.queue2 = []; } PriorityQueue.prototype.push = function (value) { this.queue.push(value); this.queue.sort(); }; PriorityQueue.prototype.pop = function () { var pop = this.queue.shift(); return pop; }; PriorityQueue.prototype.peak = function () { this.queue.sort(function (a, b) { return a - b; }); var peak = this.queue.shift(); return peak; }; ------------------------------------------------------------ ・ 次の２行を付け加えました。 document.driver.push.value = ""; document.driver.push.focus(); ・ 名前をpeakに統一しました。 ------------------------------------------------------------ <script> var q = new PriorityQueue(); function doPush() { var val = document.driver.push.value; q.push(val); var log = document.getElementById("log"); log.innerHTML += "push(" + val + ")\n<br/>"; document.driver.push.value = ""; document.driver.push.focus(); } function doPop() { var val = q.pop(); var log = document.getElementById("log"); log.innerHTML += "pop() -> " + val + "\n<br/>"; } function doPeak() { var val = q.peak(); var log = document.getElementById("log"); log.innerHTML += "peek() -> " + val + "\n<br/>"; } </script>
その他の回答 (1)
- OKbokuzyo
- ベストアンサー率43% (130/296)
ざっとしか見てないけど、多分queueとqueue2を解決できないから。 解決方法は２通りあって、prototypeプロパティにこだわるなら queueとqueue2を外部から参照できるようにしなくてはならない。 すなわち、 function PriorityQueue(){ this.queue=[]; this.queue2=[]; } PriorityQueue.prototype.push = function (value){ this.queue.push(value); this.queue.sort(); this.queue.sort(function(queue,queue2) { return queue-queue2; }); } - - - 以下略 - - - もうひとつはprototypeプロパティを利用して後から追加しているメソッドを 始めからファンクションの中に閉じて定義しておく方法。 すなわち function PriorityQueue(){ var queue=[]; var queue2=[]; this.push = function (value){ queue.push(value); queue.sort(); queue.sort(function(queue,queue2) { return queue-queue2; }); } } - - - 以下略 - - - 前者と後者には若干違いがあって 前者はqueueとqueue2変数をfunctionの（パブリックな）フィールドとしているために 外部からアクセスできてしまう。 つまり、上記html内部において、「q.queue」とするとqueue変数を参照することができる。 後者はqueue、queue2ともに通常の変数であるため、ファンクション内において 参照が可能であり、外部から参照されることが無い。 オブジェクト指向的に言えば、フィールドを自由に触れることはあんまりよろしくないそうなので 個人的には後者の利用を推奨する。 余談だが、pushメソッドの後半に書かれている「queue.sort(function～」は この記述では引数のファンクションは実行されていないので 無意味に見えます。 無名関数を実行するには最後に()が必要です。
お礼
コメントありがとうございました。テキストを参考にしながら、つぎはぎでプログラムを書いているのですが、やっぱり本質的な内容を理解していないと間違いになかなか気づけないものですね。 いただいた内容を踏まえて修正したところ、うまく動きました。 ありがとうございました。
関連するQ&A
- <input type="file"/>
に文字列をセットするために <form> <input type="file" id="x"/> </form> <input type="button" onclick="f()" value="push"/> <script> function f() { var e=document.getElementById("x"); e.value="x.txt"; } </script> としてもセットできません <form> <input type="text" id="x"/> </form> <input type="button" onclick="f()" value="push"/> <script> function f() { var e=document.getElementById("x"); e.value="x.txt"; } </script> であればセットできるのです どうしたらセットできるでしょうか？
- ベストアンサー
- JavaScript
- テキスト内容の変化でイベント発生
下記のようなコードでイベントを発生したいと考えています。 キーボードによる打ち込みではなく、文章をコピー＆ペーストすることで 「firstBox2」の表示を消し、「secondBox2」を表示させたいと考えています。 ご教授お願いします。 <input id="target_input" type="text" value="" /> <select id="firstBox2"> <option value="select1">-----</option> <option value="select2">------</option> </select> <select id="secondBox2" style="display:none;"> <option value="select1">午前中</option> <option value="select2">2度目以降の利用</option> </select> <script type="text/javascript"> var timer = null; var input = document.getElementById("target_input"); var prev_val = input.value; input.addEventListener("focus", function(){ window.clearInterval(timer); timer = window.setInterval(function(){ var new_val = input.value; if(prev_val != new_val){ document.getElementById('firstBox2').style.display = "none"; document.getElementById('secondBox2').style.display = ""; }; prev_value = new_value; }, 10); }, false); input.addEventListener("blur", function(){ window.clearInterval(timer); }, false); } </script>
- 締切済み
- JavaScript
- prototypeという予約後について
prototype プロトタイプ・キーワード。オブジェクトにプロパティを追加するときに使用する。 とのことですが、以下の２つは異なるのでしょうか？ (1)---------------- var M = function(){}; M.val = 1; ------------------- (2)---------------- var M = function(){}; M.prototype.val = 1; ------------------- どう違うのかヒントください。
- 締切済み
- JavaScript
- チェックボックスが選択されたらファイルを読み込む
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> function getChecked(name) { var AllVals = $('input[name="' + name + '"]:checked').map(function() { return this.value; }); AllVals = $.makeArray(AllVals).join('|'); return AllVals; } function getContents(){ var colorId = getChecked('color_id'); var categoryId = getChecked('category_id'); var serviceId = getChecked('service_id'); var http = $.get ( "http://localhost/eigazuki/results/title:/time:0～300/country_id:" + categoryId + "/genre_id:" + serviceId, null, function ( data ) { $("#serviceListSection").html(data); } ) }; $(function(){ $('input[name]:checkbox').change(function(){getContents();}); }); </script> </head> <body> <input type="checkbox" name="color_id" value="1" />赤 <input type="checkbox" name="color_id" value="2" />黒 <br> <input type="checkbox" name="category_id" value="1">男物 <input type="checkbox" name="category_id" value="2">女物 <br> <input type="checkbox" name="service_id" value="1">季節 <input type="checkbox" name="service_id" value="2">お祝い </body> </html> <section id="serviceListSection"></section> というコードを書き、チェックボックスがチェックされるたびに、 http://localhost/eigazuki/results/title:/time:0～300/country_id:" + categoryId + "/genre_id:" + serviceId の外部ファイルを読み込みたいのですが、全く上手くいきませんなにがダメなのでしょうか？ よろしくお願いします！
- 締切済み
- JavaScript
- 電卓のJavaScript
初心者で申し訳ないのですが、電卓のソースを作ってみたのですが、JavaScriptが間違っているためか「ページにエラーが発生しました」となり計算が行われません。 どのように、改変すればいいのでしょうか？どうかご教授お願いします。 <html> <head> <title> 電卓 </title> <script language = "JavaScript"> count = 0; sum= 0; flag =0; list = new Array( "0", "0","0","0","0",); function clist( ) { for( i = 0 ; i < 5 ; i++ ) { list[i] =0; } } function calc1() { num = sum; clist( ); display.value = num; flag = 1; } function calc2() { num = sum; clist( ); display.value = num; flag = 2; } function calc3() { num = sum; clist( ); display.value = num; flag = 3; } function calc4() { num = sum; clist( ); display.value = num; flag = 4; } function calc5() { clist( ); } function equal() { if(flag==1) { sum=num+sum; display.value=sum; clist( ); } else if(flag==2) { sum=num-sum; display.value=sum; clist( ); } else if(flag==3) { sum=num*sum; display.value=sum; clist( ); } else if(flag==4) { sum=num/sum; display.value=sum; clist( ); } } function push0( ) { list[count] = 0; sum = list[count]; for( i = 0 ; i < count ; i++ ) { temp=1; for( j = i ; j < count ; j++ ) { temp=temp*10; } sum+ =list[i]*temp; } count+=1; display.value=sum; } function push1( ) { list[count] = 1; sum = list[count]; for( i = 0 ; i < count ; i++ ) { temp=1; for( j = i ; j < count ; j++ ) { temp=temp*10; } sum+ =list[i]*temp; } count+=1; display.value=sum; } 同様に２～９ </script> </head> <body> <hr><br> <input type = "button" value ="7" onclick = "push7()">  <input type = "button" value ="8" onclick = "push8()">  <input type = "button" value ="9" onclick = "push9()">   <input type = "button" value ="+" onclick = "calc1()"> <br><br> <input type = "button" value ="4" onclick = "push4()">  <input type = "button" value ="5" onclick = "push5()">  <input type = "button" value ="6" onclick = "push6()">   <input type = "button" value ="-" onclick = "calc2()"> <br><br> <input type = "button" value ="1" onclick = "push1()">  <input type = "button" value ="2" onclick = "push2()">  <input type = "button" value ="3" onclick = "push3()">   <input type = "button" value ="×" onclick = "calc3()"> <br><br> <input type = "button" value ="0" onclick = "push0()">  <input type = "button" value ="=" onclick = "equal()">  <input type = "button" value ="C" onclick = "calc5()">   <input type = "button" value ="÷" onclick = "calc4()"> <br><br> <br><br><hr><br>    <input type = "text" size ="10" name = "display">  <br><br><hr><br> </body> </html>
- ベストアンサー
- JavaScript
- javascriptで別ファイルで変数を取得する。
A.htmlで入力した文字をB.htmlに出るようにしたいのですが、全然出ません。 アラートは表示されるのですが、入力欄に何を打っても、 namae と出てしまいます。変数に何も入ってないようです。 これを〔javascript〕って入力すれば、アラートに〔javascript〕って出るようにしたいのですが、どうしたらよろしいでしょうか？ 〔A.html〕 <script type="text/javascript"> var val=namae; window.localStorage.setItem("result", val); </script> <form action="B.htm" id="form1" method="post" onsubmit="check()"> <p>名前<br><input type="text" name="namae" id="buttom" size="28" /></p> <input type="submit" value="送信"/> </form> 〔B.html〕 <script type="text/javascript"> var val = window.localStorage.getItem("result"); alert(val); </script>
- ベストアンサー
- JavaScript
- 外部ファイルを読み込んで表示
これが外部ファイル（CheckUtil.js）です。 //入力データ(テキストデータやテキストエリア)の必須チェック function requiredCheck(strVal,strErr) { if(strVal=="" || strVal==undefined){ return strErr + "は必須入力です \r"; }else{ return ""; } } これを読み込んで表示させたいです。 <HTML> <HEAD> <META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=sjis"> <TITLE>ファイル操作</TITLE> <!-- {literal} --> <script language="JavaScript" src="CheckUtil.js"></script> <script language="JavaScript"> </HEAD> <BODY> <!-- function chk(part){ strErr = ""; strErr+ = requiredCheck(part.value,"なまえ"); if(strErr == ""){ return true; }else{ window.alert(strErr); return false; } } //--> </script> <!-- {/literal} --> <BR> <FORM ACTION="<?php echo $PHP_SELF; ?>" METHOD="POST" name="fm" onsubmit="return chk()> <INPUT TYPE="text" NAME="name" SIZE="40"><BR> <INPUT TYPE="text" NAME="comment" SIZE="40"><BR><BR> <INPUT TYPE="submit" NAME="submit" VALUE="ボタン" onsubmit="return chk()"><BR> </FORM> <BR><BR> </CENTER> </BODY> </HTML>
- ベストアンサー
- JavaScript
- hiddenにjavascript関数の戻り値
下記のPHPスクリプト内において、hidden属性で、テキストエリアの文章を 自分自身（deleteUpdate.php）に、POSTメソッドで送信しているのですが、 $text_val = $_POST['text_val']をvar_dump()すると、NULLになって、 テキストエリアで更新した文章が入ってきません。 どこが間違っているのか、教えていただきたいです。 <script language="javascript"> <!-- function getText(){ var text = document.getElementByID('contents').value; return text; } //--> </script> ～ <input type="hidden" name="text_val" id="text_val" value="<script>getText()</script>">
- ベストアンサー
- JavaScript
- 構造がよく分かりません
以下のJavascriptのコードで、クリックすると ---変数テスト なし あり グローバル変数 となり、debug()が３つありますが、どのような構造がよく分かりません。つまりfunction debug(str)とfunction debugClear()の意味がよく分かりません。 <html> <head><title>ゆーざーかんり</title> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <script type="text/javascript"> var globalVar= "グローバル変数"; function varTest(){ debugClear(); debug("---変数テスト"); val1 = "なし"; debug(val1); var val2 ="あり"; debug(val2); debug(globalVar); } function debug(str){ document.getElementById("debug"). innerHTML += "<br/>" +str; } function debugClear(){ document.getElementById("debug").innerHTML = ""; } </script> </head> <body> <input type="button" value="変数のテスト" onclick="varTest()"/><br/> <div id="debug">デバッグ</div> </body> </html>
- ベストアンサー
- JavaScript
- チェックボックスとテキストボックスを連動させたい
JavaScriptでチェックボックスにチェックが入るとテキストボックス自動で数字の1が入る仕組みを作っています。 以下のソースまではかけたのですが 列はそれほどないのですがと行数が多数存在します。 ファンクションが一つで済む方法はありませんでしょうか。 またデータを配列で送信したいのですが配列ですと動きません。 是非教えて頂けると幸いです。 <SCRIPT LANGUAGE="JavaScript"> function check1(radio) { //チェックボックスにチェックが入った場合 if(radio.checked) { form = radio.form; form.data1[1].value = radio.value; form.data1[2].value = radio.value; form.data1[3].value = radio.value; form.data1[4].value = radio.value; }else{ //チェックが外された場合 form = radio.form; form.data1[1].value = ""; form.data1[2].value = ""; form.data1[3].value = ""; form.data1[4].value = ""; } } function check2(radio) { //チェックボックスにチェックが入った場合 if(radio.checked) { form = radio.form; form.val5.value = radio.value; form.val6.value = radio.value; form.val7.value = radio.value; form.val8.value = radio.value; }else{ //チェックが外された場合 form = radio.form; form.val5.value = ""; form.val6.value = ""; form.val7.value = ""; form.val8.value = ""; } } </SCRIPT> <FORM METHOD="POST"> <INPUT TYPE="checkbox" NAME="r" VALUE="1" onclick="check1(this)">チェック1<BR> <INPUT NAME="data1[1]" SIZE="1"> <INPUT NAME="data1[2]" SIZE="1"> <INPUT NAME="data1[3]" SIZE="1"> <INPUT NAME="data1[4]" SIZE="1"><br> <INPUT TYPE="checkbox" NAME="r" VALUE="1" onclick="check2(this)">チェック2<BR> <INPUT NAME="val5" SIZE="1"> <INPUT NAME="val6" SIZE="1"> <INPUT NAME="val7" SIZE="1"> <INPUT NAME="val8" SIZE="1"> </FORM>
- ベストアンサー
- JavaScript
お礼
サンプルコードまでご提示いただきありがとうございました。 いただいたコメントを参考にプログラムを修正したところ、おができました無事に実行することができました！感激です。 本当にありがとうございました。