greasemonkeyでスクリプトが動かない理由と解決方法

このQ&Aのポイント
  • greasemonkeyでスクリプトを作成したいのですが、テスト用に書いたjavascriptをgreasemonkeyに設定したところ、スクリプトが起動しなくなりました。
  • HTMLの変更ができないため、Greasemonkeyを使用して追加機能を実装したいです。
  • 作成したサンプルソースの一部が正しく動作しない理由は、関数の呼び出し方に間違いがあります。関数を正しく呼び出すことで問題が解決できます。
回答を見る
  • ベストアンサー

greasemonkeyでfunction動かない

greasemonkeyでスクリプトを作成したいのですが、テスト用に書いたjavascriptをぐれもんに設定したところ、スクリプトが起動しなくなりました。 ※javascript、greasemonkey共に初心者です。 ご指摘いただけると幸いです。 HTML部分は、既存のサイトにつき変更できないため、ぐれもん(JS)にて、追加機能を持たせたい。 ======= 作成したサンプルソース JSで作成した、最下部の入力文字を発送日窓複数に一括反映するためのスクリプトです。 ======= <SCRIPT LANGUAGE="JavaScript"> <!-- window.onload=function(){ var myForm=document.createElement('form'); myForm.setAttribute("name","frm_test2"); var inps=new Object; inps[0]=document.createElement('input'); inps[0].setAttribute("type","text"); inps[0].setAttribute("name","atai"); inps[0].setAttribute("value",""); inps[1]=document.createElement('input'); inps[1].setAttribute("type","button"); inps[1].setAttribute("onClick",'test()'); inps[1].setAttribute("value","実行"); for(var i in inps){ myForm.appendChild(inps[i]); } document.body.appendChild(myForm); } function test(){ num = document.rjForm2.length for (var i=0; i<num; i++){ formname = document.rjForm2[i].name; formname=formname.substring(0,13); if (formname=="shipping_date"){ document.rjForm2[i].value = document.frm_test2.atai.value; } } } //--> </SCRIPT> <body> <form name="rjForm2"> <table> <tr> <td> <input type="text" name="shipping_date_123456-12345678-123456781">発送日 </td> </tr> <tr> <td> <input type="text" name="pay_date_123456-12345678-123456781">振込日 </td> </tr> </table> <table> <tr> <td> <input type="text" name="shipping_date_123456-12345678-123456785">発送日 </td> </tr> <tr> <td> <input type="text" name="pay_date_123456-12345678-123456785">振込日 </td> </tr> </table> </form> </body> ====== 上記JS部分を以下のようにgreasemonkeyに反映した経緯と、結果 ・サイトで見つけたサンプルを元にwindow.onloadの前後は、()を使ったら、この部分は、実行できた。 ・しかし、function test部分は、()を使ってもできず、firebugでは、「test is not defined」と出て、発送日窓に一括登録ができない。 ====== 以下、greasemonkeyに設定したスクリプト ( window.onload=function(){ var myForm=document.createElement('form'); myForm.setAttribute("name","frm_test2"); var inps=new Object; inps[0]=document.createElement('input'); inps[0].setAttribute("type","text"); inps[0].setAttribute("name","atai"); inps[0].setAttribute("value",""); inps[1]=document.createElement('input'); inps[1].setAttribute("type","button"); inps[1].setAttribute("onClick",'test()'); inps[1].setAttribute("value","実行"); for(var i in inps){ myForm.appendChild(inps[i]); } document.body.appendChild(myForm); }()); function test(){ num = document.rjForm2.length for (var i=0; i<num; i++){ formname = document.rjForm2[i].name; formname=formname.substring(0,13); if (formname=="shipping_date"){ document.rjForm2[i].value = document.frm_test2.atai.value; } } } ======= 何卒よろしくお願いいたします。

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

  • ベストアンサー
  • notnot
  • ベストアンサー率47% (4846/10257)
回答No.3

>確認してみたのですが、うまく動作しないようです。 テストしてみましたけど、動きますね。 No2に書いたのは前半だけなのでそれだけじゃダメですよ。もう一回全体を書いておきます。 これでだめなら、そもそもGreasemonkeyの使い方がおかしいと思います。 あと、質問のこつですが、「うまくいかない」というのは情報量がほとんどゼロなので、「これこれこういう結果になる」と書くと良いです。 var test='(function(){\ var num = document.rjForm2.length;\ for (var i=0; i<num; i++){\ var formname = document.rjForm2[i].name;\ formname=formname.substring(0,13);\ if (formname=="shipping_date"){\ document.rjForm2[i].value = document.frm_test2.atai.value;}}})()'; var myForm=document.createElement('form'); myForm.setAttribute("name","frm_test2"); var inps=new Object; inps[0]=document.createElement('input'); inps[0].setAttribute("type","text"); inps[0].setAttribute("name","atai"); inps[0].setAttribute("value",""); inps[1]=document.createElement('input'); inps[1].setAttribute("type","button"); inps[1].setAttribute("onClick",test); inps[1].setAttribute("value","実行"); for(var i in inps){ myForm.appendChild(inps[i]); } document.body.appendChild(myForm);

naruto33
質問者

お礼

できました! 回答2のときは、ご指摘のとおり、test部分のみの反映だけしかしておりませんでした。 質問の仕方も合わせ、ご指摘ありがとうございます。 JSはほとんど触ったことがないので、自分の中ではこの機能も想像のみの機能になってしまう可能性は十分だったのですが、notnot様のお力添えのもの、実現することができました。 本当にありがとうございました。

その他の回答 (2)

  • notnot
  • ベストアンサー率47% (4846/10257)
回答No.2

No1です。ちょっとぼーっとしてました。あれじゃダメですね。testのところに、(。。。)() が要りますので全体を文字列にします。 var test='(function(){\ var num = document.rjForm2.length;\ for (var i=0; i<num; i++){\ var formname = document.rjForm2[i].name;\ formname=formname.substring(0,13);\ if (formname=="shipping_date"){\ document.rjForm2[i].value = document.frm_test2.atai.value;}}})()'; 以降はそのまま。

naruto33
質問者

補足

遅くなりました。 確認してみたのですが、うまく動作しないようです。 最後の「)()」が気になったので→「())」としてみましたがだめでした。 これが完成すれば、業務がかなり楽になりそうなので、ぜひ再度ご確認いただければ幸いです。 何卒よろしくお願いします。

  • notnot
  • ベストアンサー率47% (4846/10257)
回答No.1

Greasemonkeyスクリプトは、独立した環境で動きます。 全体が、 (funciotn(){ 。。。。。。 )(); で囲まれているのと同じです。従って、ここで定義した関数testは、そと(HTML)から参照出来ません。 テストしてませんが、こんな感じですね。 var test=function(){ var num = document.rjForm2.length for (var i=0; i<num; i++){ var formname = document.rjForm2[i].name; formname=formname.substring(0,13); if (formname=="shipping_date"){ document.rjForm2[i].value = document.frm_test2.atai.value; } } } var myForm=document.createElement('form'); myForm.setAttribute("name","frm_test2"); var inps=new Object; inps[0]=document.createElement('input'); inps[0].setAttribute("type","text"); inps[0].setAttribute("name","atai"); inps[0].setAttribute("value",""); inps[1]=document.createElement('input'); inps[1].setAttribute("type","button"); inps[1].setAttribute("onClick",test); inps[1].setAttribute("value","実行"); for(var i in inps){ myForm.appendChild(inps[i]); } document.body.appendChild(myForm);

関連するQ&A

  • テーブルの行削除について

    以前、テーブルの行追加について教えてもらい出来ましたが 逆に、追加された行を削除する方法を教えてください。 <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS"> <TITLE>行追加・削除</TITLE> </HEAD> <BODY> <TABLE BORDER="1" id="Table1"> <TR> <TH>タイトルA</TH> <TH>タイトルB</TH> </TR> <TR> <TD><INPUT TYPE="text" SIZE="18" MAXLENGTH="18" NAME="A" VALUE=""></TD> <TD><INPUT TYPE="text" SIZE="18" MAXLENGTH="18" NAME="B" VALUE=""></TD> </TR> </TABLE> <INPUT TYPE="button" VALUE="行追加" onclick="addRow()"> <INPUT TYPE="button" VALUE="行削除"> <script language="JavaScript"> function addRow() { var tbl = document.getElementById("Table1").firstChild; if (!tbl.tagName) { tbl = document.getElementById("Table1"); } var tr = document.createElement("tr"); var td1 = document.createElement("td"); var tx1 = document.createElement("input"); tx1.setAttribute("type","text"); tx1.setAttribute("size","18"); tx1.setAttribute("maxlength","18"); tx1.setAttribute("name","Cn"); tx1.setAttribute("value",""); td1.appendChild(tx1); var td2 = document.createElement("td"); var tx2 = document.createElement("input"); tx2.setAttribute("type","text"); tx2.setAttribute("size","18"); tx2.setAttribute("maxlength","18"); tx2.setAttribute("name","Cn"); tx2.setAttribute("value",""); td2.appendChild(tx2); tr.appendChild(td1); tr.appendChild(td2); tbl.appendChild(tr); } </script> </BODY> </HTML>

  • 記述方法について

    よろしくお願いします。前回こちらで教えて頂いたソースを 基に表示するテーブルの並び方を変えたいと思っています。 理想の並び方は、例として くま さる           くま  さる ごりら  これらを→ごりら うま  うま           りす りす というように読み込んだエクセルのレコードを2列ずつにして表したいのですが、可能でしょうか? 以下のソースを基に、色々試したのですが、ブラウザ上には何も出てきません。 -------------------------------------------------------------- <html> <head> <title>TEST CSV IN</title> <script type="text/javascript"> function hoge(){ var TEST = document.getElementById("TEST"); var output = document.getElementById("OUTPUT"); var table = document.createElement("table"); table.setAttribute("border","1"); table.setAttribute("datasrc","#TEST"); var tbody = document.createElement("tbody"); var trs = new Array(); var tds = new Array(); TEST.Reset(); var rs = TEST.recordset; while (!rs.EOF){ var tbl = document.createElement("table"); table.setAttribute("border","1"); var td = document.createElement("td"); for(var i=1; i<2; i++){   var tr = document.createElement("tr");   trs[0] = document.createElement("tr");   trs[1] = document.createElement("tr");   trs[2] = document.createElement("tr"); tds[0] = document.createElement("td"); tds[1] = document.createElement("td"); tds[2] = document.createElement("td"); var img = document.createElement("img"); img.setAttribute("src",rs.fields(0)); img.setAttribute("alt",""); tds[0].appendChild(img); tds[1].innerText = rs.fields(1); tds[2].innerText = rs.fields(2); trs[0].appendChild(tds[0]); trs[1].appendChild(tds[1]); trs[2].appendChild(tds[2]); tr.appendChild(trs[0]); tr.appendChild(trs[1]); tr.appendChild(trs[2]); tbody.appendChild(tr); } rs.MoveNext; } table.appendChild(tbody); output.appendChild(table); } </script> </head> <body onload="hoge();"> CSV DATA IMPORT Ver MINO <p> <object id="TEST" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="cn.csv" /> <param name="UseHeader" value="true" /> <param name="TextQualifier" value="'"> <param name="FieldDelim" value=","> </object> <div id="OUTPUT"> </div> </body> </html> ------------------------------------------------------------- javascriptを始めたばかりなので、まだよく理解していないので 大変申し訳ありませんが、ご指導願えればと思います。 よろしくお願いします。

  • 追加したテキストボックスとテキストエリアの数の制御

    下記のようにテキストボックスとテキストエリアの数をボタンを押すことによって増やしていきます。 で、テキストボックスとテキストエリアは最大10個までとしたいのですが、どのようにしたらいいでしょうか? あとテキストエリアを追加していくとテキストエリアとテキストエリアの間が詰まってしまいます。間を空ける方法はないでしょうか? <script type="text/javascript"> function myAdd(){ var oTR=document.createElement("tr"); var c=count("mat"); var names=["mat","qua"]; for(var i in names){ var oTD = document.createElement("td"); var oTag = document.createElement("input"); oTag.setAttribute("type", "text"); oTag.setAttribute("name", names[i] + (c+1).toString()); oTD.appendChild(oTag); oTR.appendChild(oTD); } document.getElementById("t0").getElementsByTagName("tbody")[0].appendChild(oTR); } function count(name){ var tags=document.getElementsByTagName("input"); var c=0; var reg=RegExp("^"+name+"[0-9]+$"); for(var i=0;i<tags.length;i++){ if(tags[i].name.match(reg)){ c++; } } return c; } var tag_num = 4; function myTextAreaAdd(){ var oTag = document.createElement("textarea"); oTag.setAttribute("name", "foo" + tag_num++); var oDiv = document.getElementById("area"); oDiv.appendChild(oTag); } </script> </head> <body><form method="post" enctype="multipart/form-data" action="check.php"> <table id="t0" border> <tbody> <tr><td><input type="text" name="mat1" value=""></td> <td><input type="text" name="qua1" value=""></td> </tr> <tr><td><input type="text" name="mat2" value=""></td> <td><input type="text" name="qua2" value=""></td> </tr> <tr><td><input type="text" name="mat3" value=""></td> <td><input type="text" name="qua3" value=""></td> </tr> <tr><td><input type="text" name="mat4" value=""></td> <td><input type="text" name="qua4" value=""></td> </tr> </tbody> </table> <input type="button" value="追加する" onClick="myAdd()"> <br /> <span id="area"> <textarea name="foo1"></textarea> <textarea name="foo2"></textarea> <textarea name="foo3"></textarea> <textarea name="foo4"></textarea> </span><br /> <input type="button" value="追加する" onClick="myTextAreaAdd()"><br /> </form>

  • テーブルにおける行(セルにプルダウン含む)の追加方法

    追加ボタンを押度に,テーブルに1行ずつ追加されるプログラムを組んでいるのですが,追加ボタンを押しても何も起こりません.1行には,テキストボックスとプルダウンメニューの2つのセルが含まれます.テキストボックスのみであれば,追加に成功します. プルダウンのメニュー項目の追加方法ではなく,プルダウン自体を複製して追加していきたいのですが,参考サイトが見つかりませんでした.また,各行を識別する為一意の名前をつけたいのですが,どう記述したらよろしいでしょうか. お手数おかけしますが,下記ソースのどこが間違っているのか,どう処理すべきなのかを,ご教示頂けますでしょうか.お願い致します. <BODY> <TABLE id="Table1"> <TR> <td class="cellWhite"><input type="text" value="単語入力" onFocus="cText(this)" onBlur="sText(this)" style="color:#999"></td> <td bgcolor="#5096C9" width="113px"> <select name="column"> <option value="00">赤</option> <option value="01">青</option> <option value="02">黄</option> </select></td></tr></TABLE> <INPUT TYPE="button" VALUE="行追加" onclick="addRow()"> <script language="JavaScript"> function addRow() {  var tbl = document.getElementById("Table1").firstChild;  if (!tbl.tagName) {    tbl = document.getElementById("Table1");}  var tr = document.createElement("tr");  var td1 = document.createElement("td");  td1.setAttribute("class","cellWhite");  var tx1 = document.createElement("input");  tx1.setAttribute("type","text");  tx1.setAttribute("value","単語入力");  tx1.setAttribute("onFocus","cText(this)");  tx1.setAttribute("onBlur","sText(this)");  tx1.setAttribute("style","color:#999");  td1.appendChild(tx1);  var td2 = document.createElement("td");  var selectName="column";//selectの名前  var options={0:"赤",1:"青",2:"黄"};  var c=sel.firstChild;  while(c){   if(c.name==selectName) sel.removeChild(c);     c=c.nextSibling;}   var e=document.createElement("select");   e.setAttribute("name",selectName);   for(var i in options){     var o=document.createElement("option");     o.setAttribute("value",options[i]);     o.appendChild(document.createTextNode(options[i]));     e.appendChild(o);}   sel.appendChild(e);   tr.appendChild(td1);tr.appendChild(td2);tbl.appendChild(tr);}</script> 参考にしたサイトです: http://oshiete1.watch.impress.co.jp/qa4074195.html http://okwave.jp/qa299889.html

  • POSTすると配列の数がおかしくなる

    matとquaとhowtoをそれぞれ4つPOSTしているのですが、POSTされたデータを受け取るとmat4つ、qua5つ、howto5つと数がおかしくなります。 なぜかわかりません。とくにインクリメントしていないのに増えます。 教えて下さい。 <script type="text/javascript"> function myAdd(obj){ var max=15; var c=count("mat"); if(c>=max) return false; var oTR=document.createElement("tr"); var names=["mat","qua"]; for(var i in names){ var oTD = document.createElement("td"); var oTag = document.createElement("input"); oTag.setAttribute("type", "text"); oTag.setAttribute("name", names[i] + (c+1).toString()); oTD.appendChild(oTag); oTR.appendChild(oTD); } document.getElementById("t0").getElementsByTagName("tbody")[0].appendChild(oTR); if(c>=max-1) obj.disabled=true; } function count(name){ var tags=document.getElementsByTagName("input"); var ta=document.getElementsByTagName("textarea"); var c=0; var reg=RegExp("^"+name+"[0-9]+$"); if(tags){ for(var i=0;i<tags.length;i++){ if(tags[i].name.match(reg)){ c++; } } } if(ta){ for(var i=0;i<ta.length;i++){ if(ta[i].name.match(reg)){ c++; } } } return c; } function myTextAreaAdd(obj){ var max=15; var c=count("howto"); if(c>=max) return false; var oTag = document.createElement("textarea"); oTag.setAttribute("name", "howto" + tag_num++); var oDiv = document.getElementById("area"); oDiv.appendChild(oTag); if(c>=max-1) obj.disabled=true; } </script> </head> <body> <form method="post" enctype="multipart/form-data" action="check.php"> <textarea name="explain"></textarea> <table id="t0" border> <tbody> <tr> <td><input type="text" name="mat1" /></td> <td><input type="text" name="qua1" /></td> </tr> <tr> <td><input type="text" name="mat2" /></td> <td><input type="text" name="qua2" /></td> </tr> <tr> <td><input type="text" name="mat3" /></td> <td><input type="text" name="qua3" /></td> </tr> <tr> <td><input type="text" name="mat4" /></td> <td><input type="text" name="qua4" /></td> </tr> </tbody> </table> <input type="button" value="追加する" onClick="myAdd(this)"> <br /> <span id="area"> <textarea name="howto1"></textarea> <textarea name="howto2"></textarea> <textarea name="howto3"></textarea> <textarea name="howto4"></textarea> </span><br /> <input type="button" value="追加する" onClick="myTextAreaAdd(this)"> <input type="submit" value="送る"> </form>

  • 動的に作成したテキストボックスの値をaspへ

    いつもお世話になっております。 javaスクリプトで動的にテキストボックスを作成し、 実行ボタンを押すと値をhiddenでtest.aspへ渡すことは可能でしょうか? 不可能であれば。。。。 test.aspへ値を渡す良い方法がありましたら、ご教示くださますようお願いいたします。 環境:IIS7.5 クラッシックASP 以下、ソースを参照してください。。。 *自宅では環境がないため、 印刷を見ながら手で入力しました。 確認して投稿しましたが。。。打ち間違い等あったらご指摘くださいませ>< --------以下ソース抜粋 addtext.asp ------------------- <script language="JavaScript"> <!-- function addDev(){ var targetName; var idObj; var tbObj; var devBlockCnt; idObj = document.getElementById("histTablebody"); tdObj = idObj.getElementsByTagName("tbody"); devBlockCnt++; targetName = "devBlock" + devBlockCnt; var mybody = document.getElementById("histTablebody"); tbcurrent_row = document.createElement("TBODY"); tbcurrent_row.setAttribute("id",targetNam); mycurrent_row=document.createElement("TR"); mycurrent_cell=document.createElement("TD"); mycurrent_row.appendChild(mycurrent_cell); mycurrent_cell=document.createElement("TD"); mycurrent_row.appendChild(mycurrent_cell); mycurrent_cell=document.createElement("TD"); mycurrent_row.appendChild(mycurrent_cell); mycurrent_cell=document.createElement("TD"); mycurrent_row.appendChild(mycurrent_cell); mycurrent_cell=document.createElement("TD"); mycurrent_row.appendChild(mycurrent_cell); tbcurrent_row.appendChild(mycurrent_row); mycurrent_row=document.createElement("TR"); mycurrent_row.setAttribute("id",histrow1); mycurrent_cell=document.createElement("TD"); mycurrent_form=document.createElement("INPUT"); mycurrent_form.setAttribute("type","TEXT"); mycurrent_form.setAttribute("name","devEntry1"); mycurrent_form.setAttribute("id","devEntry1"); mycurrent_form.setAttribute("value",""); mycurrent_cell.appendChild(mycurrent_form); mycurrent_row.appendChild(mycurrent_cell); tbcurrent_row.appendChild(mycurrent_row); mybody.appendChild(tbcurrent_row); } //--> </script> <html> <head> <title>TEST</title> </head> <body> <div align="center"> <table border="1"> <tr> <td align="left" valign="middle">入力1</td> <td> <form name="fmDev"> <div> <table border="0" id="histTablebody"> <tbody id="devBlock1"> <tr><td></td></tr> <tr id="histrow1"> <td><input type="text" name="devEntry1" id="devEntry1"> </td> </tr> </tbody> </table> </div> <table> <tr><td><input type="button" id=addDevid value="追加" onClick="addDev();"> </td> </tr> </table> </form> </td> </tr> <form name="fmHoki"> <tr> <td align="left" valign="middle">入力2</td> <td align="left"><textarea row="5" name="hokiTXT" cols="60"></textarea></td> </tr> </form> </table> </div> <teble border="0"> <tr> <form action="test.asp" method="post" name="fm2"> <tr><input type="submit" value="登録実行" alt=""></td>     <input trype="hidden" name="hokiTXT"> </form> <form name="fm3"> <td><input type="button" value="戻る" onclick="location.href='menu01.asp';"></td> </form> </tr> </teble> </body> </html> <SCRIPT LANGUAGE="vbscript"> '--------------------------------------- ' test.asp へ行く前の処理 '--------------------------------------- Sub fm2_OnClick() Dim i Document.fm2.hokiTXT.value = Document.fmHoki.hokiTXT.value  '--ここで動的に作成したテキストボックスの値をtest.aspへ渡す処理が  'わかりません。。。。。  'debug確認用 ↓ for i=0 to document.fmDev.length msgbox document.fmDev.element(i).name,,"test" msgbox document.fmDev.element(i).value,,"test" next End Sub </SCRIPT>

  • 教えてプログラム

    Java Scriptで自動計算を行いたいのですが、うまいくいきません もう少しだと思うのですが、修正をお願いいたします。 在庫確保数+新規作成数*単価=合計で算出したいです。 NuNがなるべくでないようにしたいです。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-31J"/> <title>予約登録</title> </head> <script language="javascript"> <!-- var amount = 3; var zei; var goukei; function calc(){ var total=0; var total2=0; var i=0; var go=0; var suti1,suti2; suti1 = document.myForm.d1.value; suti2 = document.myForm.d2.value; go=parseInt(suti1)+parseInt(suti2); while(i<amount*2){ total = total + document.myForm.elements[i].value*document.myForm.elements[++i].value; i++; } document.myForm.itotal.value = total; zei = total * 0.05; zei = Math.floor(zei); goukei = total + zei; document.myForm.goukei.value = goukei*go; } //--> </script> <body onload="calc()"> <FORM name="myForm" method="post"> <h2>予約登録</h2> <h3>商品一覧</h3> <table border="1" width="610"> <tr> <td>商品名</td> <td>単価</td> <td>販売可能数</td> <td>在庫確保数</td> <td>新規作成数</td> <td>金額合計</td> </tr> <tr> <td>稲荷寿司</td> <td>40<Input type="hidden" name="row0v" value="40"></td> <td>50</td> <td><input type="text" name="d1" onChange="calc()" value="0"></td> <td><input type="text" name="d2" onChange="calc()" value="0"></td> <td><input type="text" name="itotal" value="0"></td> </tr> <tr> <td>かんぴょう巻き</td> <td>40<input type="hidden" name="row1v" value="40"></td> <td>50</td> <td><input type="text" name="kanpyou1" onChange="calc()" value="0"></td> <td><input type="text" name="kanpyou2" onChange="calc()" value="0"></td> <td><input type="text" name="itotal2" value="0"></td> </tr> <tr> <td>おにぎり(梅干)</td> <td>90</td> <td>50</td> <td><input type="text" name="umeoni" value="0"></td> <td><input type="text" name="umeoni" value="0"></td> <td><input type="text" name="kanpyou" value="0"></td> </tr> <tr> <td colspan="5" align="right">単品合計金額</td> <td><input type="text" name="goukei" value="0"></td> </tr> </table> <tr> <td colspan="5" align="right">パッケージ合計金額</td> <td><input type="text" name="pakke" value="0"></td> </tr> <tr> <td colspan="5" align="right">総合計金額</td> <td><input type="text" name="sougoukei" value="0"></td> </tr> </table> <br> <br> <input type="submit" value="予約"> </form> </body>

  • javascriptで作成されたテーブルの値を取得したい

    javascriptで作成されたテーブルの値を取得したいです。 具体的には、最初に作成するテーブルの大きさを入力するフォームがあり、 ボタンを押すと、そこに入力された値によってテーブルが作成され、 さらに、そこにデータを入力して、また次のボタンを押せば テーブルに入力された値を取得できるようにしたいです。 最初のテーブルの大きさを入力するフォームと、テーブルを作成することはできたのですが、そこから入力された値を取得する方法が分からず、困っています。 そのプログラムはこんな感じです。 分かる方いらっしゃいましたら、お知恵をお貸しください。 よろしくお願いします。 <html> <head> <title>テスト</title> </head> <body> <form name="myForm"> <p>mac.itemを半角数字で入力してください</p> mac <input type="text" size="10" name="myFormKK"> item <input type="text" size="10" name="myFormI"> <input type="button" value="OK" onclick="addAll()"> </form> <br> <p>処理量 段取り時間 段取り費 梯状在庫保管費を入力</p> <form name="fpsck" method="post" enctype="text/plain" action=""> <TABLE BORDER="1" id="Table2"> </TABLE> </form> <script type="text/javascript"> //3行目以降 開始 <!-- function add3rd(){ var tbl = document.getElementById("Table2").firstChild; if (!tbl.tagName) { tbl = document.getElementById("Table2"); } kk = eval(document.myForm.myFormKK.value)-1; it = eval(document.myForm.myFormI.value)-1; for(j=0;j<=it;j++){ var tr = document.createElement("tr"); for(i=0;i<=kk*3+6;i++){ var td1 = document.createElement("td"); var tx1 = document.createElement("input"); tx1.setAttribute("type","text"); tx1.setAttribute("size","8"); tx1.setAttribute("maxlength","18"); tx1.setAttribute("name","psck"); if(i == 0){ itN = j + 1; itName = "item" +itN; tx1.setAttribute("value",itName); tx1.setAttribute("disabled","disabled"); } else{ tx1.setAttribute("value","0"); } td1.appendChild(tx1); tr.appendChild(td1); } tbl.appendChild(tr); }} //3行目以降 終了 // --> </script> <script type="text/javascript"> //すべての関数実行 <!-- function addAll(){ add3rd(); } // --> </script> </body> </html>

  • javascriptが得意な方ご教授ください。for文関連です。

    以下のソースにて?の部分を配列番号と同等にしたいのですが、うまくいきません。 やりたいことは配列のEbox_Div[0]~[3]の中にnullが入った場合その配列番号に対応するテキストボックスのEmail0~3には"空"と代入したいのです。 ※hiddenタグのEmail_hの値はTBLの状態によって異なります。 <script language="javascript"> function bunkatsu(){ var Ebox_Div = new Array(); Ebox_Div = document.myform.Email_h.value.split(","); document.myform.Email0.value = Ebox_Div[0]; document.myform.Email1.value = Ebox_Div[1]; document.myform.Email2.value = Ebox_Div[2]; document.myform.Email3.value = Ebox_Div[3]; for (i=0; i<4; i++){ if(Ebox_Div[i] == null){ document.myform.Email?.value = "空"; } } } </script> <body bgcolor="white" onLoad="bunkatsu()"> <form name="myform"> <input type="hidden" name="Email_h" value="aho,baka"> <table border="0" width="100%"> <tr><td width="10%">アドレス1</td><td width="90%"><input type="text" name="Email0" size="60"></td></tr> <tr><td width="10%">アドレス2</td><td width="90%"><input type="text" name="Email1" size="60"></td></tr> <tr><td width="10%">アドレス3</td><td width="90%"><input type="text" name="Email2" size="60"></td></tr> <tr><td width="10%">アドレス4</td><td width="90%"><input type="text" name="Email3" size="60"></td></tr> </table> よろしくお願い致します。

  • javascript でリンクを動的に変更する方法

    下記のようなシステムを作成をしようと思っています。 javascript がまだあまり理解していない為ご教授いただければ幸いです。 質問としては追加ボタンで動的に追加した際に検索部分のリンクも一緒に動的に追加したいと考えています。 下記のリンクの「この部分」にも追加するごとにiの値が入るようにしたいと考えています。 <a href="#" onClick="window.open('store1.php?from=js&amp;no=「この部分」','search_store1','width=540,height=540')">検索</a> 宜しくお願い致します。 サンプルコード <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script language="JavaScript"> <!-- var i = 1; var maxrows = 10; function hage() { i++; // Tbody への参照を取得します var mybody=document.getElementById("histTablebody"); mystore_row=document.createElement("TR"); mystore_row.setAttribute("id","histrow"+i); mystore_cell=document.createElement("TD"); mystore_cell.setAttribute("id","num"); currenttext=document.createTextNode(i); mystore_cell.appendChild(currenttext); mystore_row.appendChild(mystore_cell); mystore_cell=document.createElement("TD"); currenttext=document.createTextNode("店舗ID"); mystore_cell.appendChild(currenttext); mystore_row.appendChild(mystore_cell); mystore_cell=document.createElement("TD"); mystore_form.setAttribute("type","TEXT"); mystore_form.setAttribute("name","store_id" + i); mystore_form.setAttribute("value",""); mystore_form.setAttribute("id", "storecell"); mystore_cell.appendChild(mystore_form); mystore_form=document.createElement("INPUT"); mystore_form.setAttribute("type","TEXT"); mystore_form.setAttribute("name","store_name" + i); mystore_form.setAttribute("value",""); mystore_form.setAttribute("id", "storecell"); mystore_cell.appendChild(mystore_form); mystore_row.appendChild(mystore_cell); mystore_cell=document.createElement("TD"); //mystore_cell=document.createElement("a"); mystore_row.appendChild(mystore_cell); mybody.appendChild(mystore_row); document.register.delrow.disabled=false; if(i>=maxrows){ document.register.addrow.disabled=true; } } var hige = function() { var mytable=document.getElementById("histTablebody"); var removeTable=document.getElementById("histrow"+i); mytable.removeChild(removeTable); i--; if(i==1){ document.register.delrow.disabled=true; } // 追加ボタンを有効にする document.register.addrow.disabled=false; } var result = function() { alert(''); } //--> </script> </head> <body> <form name="register"> <div id="hist"> <table border="1"> <tbody id="histTablebody"> <tr id="histrow1"> <td id="num">1</td> <td>店舗ID</td> <td><input type="text" name="store_id1" id="storecell"><input type="text" name="store_name1" id="storecell"></td> <td> [<a href="#" onClick="window.open('store1.php?from=js&amp;no=[]','search_store1','width=540,height=540')">検索</a>] </td> </tr> </tbody> </table> </div> <table> <tr> <td> <input type="button" id=addrow value="行を追加" onClick="hage();"> </td> <td> <input type="button" id=delrow value="行を削除" onClick="hige();" disabled="true"> </td> <td> <input type="button" value="登録" onClick="result()"> </td> </tr> </table> </form> </body> </html>

専門家に質問してみよう