babu_baboo の回答履歴

全1286件中101~120件表示
  • JavaScriptで選択問題作成(3)

    お世話になります。 以前ここで質問をさせてもらった件で不具合が出来たのでまた質問をさせてもらいます。 以前のスレはこれです。 http://okwave.jp/qa/q9170301.html ここで教えてもらった通りに作成していたのですが、以下のような感じです。 <!DOCTYPE html>  <meta charset="utf-8"> <style> fieldset.q ul { list-style: none; } </style> <body> <h1>問題</h1> <fieldset class="q">  <legend>Q1. 九州の県は次のうちどれですか?</legend>  <ul>   <li><label><input type="checkbox" name="q1" value="true">福岡</label>   <li><label><input type="checkbox" name="q1" value="false">岡山</label>   <li><label><input type="checkbox" name="q1" value="false">山形</label>   <li><label><input type="checkbox" name="q1" value="true">長崎</label>   <li><label><input type="checkbox" name="q1" value="true">熊本</label>   <li><label><input type="checkbox" name="q1" value="false">新潟</label>   <li><label><input type="checkbox" name="q1" value="false">山口</label>   <li><label><input type="checkbox" name="q1" value="true">鹿児島</label>   <li><label><input type="checkbox" name="q1" value="true">佐賀</label>   <li><label><input type="checkbox" name="q1" value="false">青森</label>   <li><label><input type="checkbox" name="q1" value="true">宮崎</label>   <li><label><input type="checkbox" name="q1" value="false">千葉</label>  </ul>  <input type="button" value="解答">  <input type="hidden" name="q1" value=""> </fieldset> <p>  <input type="button" value="リセット">  <input type="button" value="終了"> <script> function check (e) {  var fieldset = e.parentNode;  var seikai = fieldset.querySelectorAll ('input[type="checkbox"][value="true"]');  var kaitou = fieldset.querySelectorAll ('input[type="checkbox"]:checked');  var hidden = fieldset.querySelector ('input[type="hidden"]');  var kotae;    if (seikai.length === kaitou.length) {   hidden.value = 'true';   alert ('正解です。');  }  else {   hidden.value = '';   kotae = Array.prototype.map.call (seikai, function (e) {    return e.parentNode.textContent;   }).join (', ');   alert ([    '不正解です。',    '答えは、'+ kotae + 'です。'   ].join ('\n'));    } } function ending () {  var es0 = document.querySelectorAll ('fieldset.q input[type="hidden"]');  var es1 = document.querySelectorAll ('fieldset.q input[type="hidden"][value=""]');  alert ([   '問題数は、'+ es0.length + 'です。',   '間違いは、' + es1.length + '問あります。'  ].join ('\n')); } function reset () {  var es = document.querySelectorAll ('fieldset.q input[type="hidden"]');  Array.prototype.forEach.call (es, function (e) { e.value = ''; }); } function listener (event) {  var e = event.target;    if ('button' === e.type)   switch (e.value) {   case '解答' :    check (e);    break;      case 'リセット' :    reset ();    break;      case '終了' :    ending ();    break;   } } reset (); document.addEventListener ('click', listener, false); </script> ここでなぜか 福岡 長崎 熊本 鹿児島 佐賀 宮崎にチェックを入れて解答したら もちろん正解になります。 その後に長崎のチェックを外してかわりに山形にチェックを入れて解答したらなぜか正解になります。もちろん山形はfalseにしています。 しかし福岡  山形 長崎 熊本 鹿児島 佐賀 宮崎にチェックを入れた状態で 解答をすると不正解になります。 何故でしょうか? 教えてください

  • JavaScriptで選択問題作成(3)

    お世話になります。 以前ここで質問をさせてもらった件で不具合が出来たのでまた質問をさせてもらいます。 以前のスレはこれです。 http://okwave.jp/qa/q9170301.html ここで教えてもらった通りに作成していたのですが、以下のような感じです。 <!DOCTYPE html>  <meta charset="utf-8"> <style> fieldset.q ul { list-style: none; } </style> <body> <h1>問題</h1> <fieldset class="q">  <legend>Q1. 九州の県は次のうちどれですか?</legend>  <ul>   <li><label><input type="checkbox" name="q1" value="true">福岡</label>   <li><label><input type="checkbox" name="q1" value="false">岡山</label>   <li><label><input type="checkbox" name="q1" value="false">山形</label>   <li><label><input type="checkbox" name="q1" value="true">長崎</label>   <li><label><input type="checkbox" name="q1" value="true">熊本</label>   <li><label><input type="checkbox" name="q1" value="false">新潟</label>   <li><label><input type="checkbox" name="q1" value="false">山口</label>   <li><label><input type="checkbox" name="q1" value="true">鹿児島</label>   <li><label><input type="checkbox" name="q1" value="true">佐賀</label>   <li><label><input type="checkbox" name="q1" value="false">青森</label>   <li><label><input type="checkbox" name="q1" value="true">宮崎</label>   <li><label><input type="checkbox" name="q1" value="false">千葉</label>  </ul>  <input type="button" value="解答">  <input type="hidden" name="q1" value=""> </fieldset> <p>  <input type="button" value="リセット">  <input type="button" value="終了"> <script> function check (e) {  var fieldset = e.parentNode;  var seikai = fieldset.querySelectorAll ('input[type="checkbox"][value="true"]');  var kaitou = fieldset.querySelectorAll ('input[type="checkbox"]:checked');  var hidden = fieldset.querySelector ('input[type="hidden"]');  var kotae;    if (seikai.length === kaitou.length) {   hidden.value = 'true';   alert ('正解です。');  }  else {   hidden.value = '';   kotae = Array.prototype.map.call (seikai, function (e) {    return e.parentNode.textContent;   }).join (', ');   alert ([    '不正解です。',    '答えは、'+ kotae + 'です。'   ].join ('\n'));    } } function ending () {  var es0 = document.querySelectorAll ('fieldset.q input[type="hidden"]');  var es1 = document.querySelectorAll ('fieldset.q input[type="hidden"][value=""]');  alert ([   '問題数は、'+ es0.length + 'です。',   '間違いは、' + es1.length + '問あります。'  ].join ('\n')); } function reset () {  var es = document.querySelectorAll ('fieldset.q input[type="hidden"]');  Array.prototype.forEach.call (es, function (e) { e.value = ''; }); } function listener (event) {  var e = event.target;    if ('button' === e.type)   switch (e.value) {   case '解答' :    check (e);    break;      case 'リセット' :    reset ();    break;      case '終了' :    ending ();    break;   } } reset (); document.addEventListener ('click', listener, false); </script> ここでなぜか 福岡 長崎 熊本 鹿児島 佐賀 宮崎にチェックを入れて解答したら もちろん正解になります。 その後に長崎のチェックを外してかわりに山形にチェックを入れて解答したらなぜか正解になります。もちろん山形はfalseにしています。 しかし福岡  山形 長崎 熊本 鹿児島 佐賀 宮崎にチェックを入れた状態で 解答をすると不正解になります。 何故でしょうか? 教えてください

  • テキストデータから文字列を取り出したい

    昔使っていたブログのデータをまとめたテキストファイル(決まった体裁にはなっています)があります。 そこから記事ごとに必要な文字列のみを取り出し、CSVにしたいです。 例えばtextareaなどにテキストを全て貼り付け、Javascriptを使い、必要な文字列のみを出力させたいのですが、どういうコードにすればいいか教えて下さい。 (改行部分のみ<br>に置き換え希望) <現在の文字列 ここから> -------- AUTHOR: hogehoge TITLE: 記事A STATUS: Publish ALLOW COMMENTS: 0 CONVERT BREAKS: __default__ ALLOW PINGS: 0 PRIMARY CATEGORY: news CATEGORY: news DATE: 02/08/2014 06:17:55 AM ----- BODY: 記事一個目。 ほげほげ ----- EXTENDED BODY: ----- EXCERPT: ----- KEYWORDS: ----- -------- AUTHOR: hogehoge TITLE: 記事B STATUS: Publish ALLOW COMMENTS: 0 CONVERT BREAKS: __default__ ALLOW PINGS: 0 PRIMARY CATEGORY: nikki CATEGORY: nikki DATE: 02/09/2014 07:45:04 PM ----- BODY: 記事2個目。 <img src="hoge.jpg"> ほげほげ ----- EXTENDED BODY: ----- EXCERPT: ----- KEYWORDS: ----- -------- AUTHOR: hogehoge TITLE: 記事C STATUS: Publish ALLOW COMMENTS: 0 CONVERT BREAKS: __default__ ALLOW PINGS: 0 PRIMARY CATEGORY: news CATEGORY: news DATE: 02/09/2014 07:51:34 PM ----- BODY: 記事3個目。ほげほげ ----- EXTENDED BODY: ----- EXCERPT: ----- KEYWORDS: ----- <文字列ここまで> <上記から抽出し、出力したい内容(カンマ区切りのcsvにするため) ここから> 記事A,news,02/08/2014 06:17:55 AM,記事一個目。<br>ほげほげ 記事B,nikki,02/09/2014 07:45:04 PM,記事2個目。<br><img src="hoge.jpg"><br>ほげほげ 記事C,news,02/09/2014 07:51:34 PM,記事3個目。ほげほげ <内容ここまで> よろしくお願いいたします。

  • スマートフォンjavascriptが一部うごかない

    プログラミングの初心者のものです javascriptの機能がスマートフォンで一部動きません 動かせるようにしたいのですがご教授お願いいたします。 試した機種は自分の機種のアイフォン5 知り合いのAndroidメディアスN06Eです。 動かないjavascriptの部分は、一つの目セレクトボックスの中身に影響されを、二つ目のセレクトボックスの中身が変わるというものです。 例 一つ目のセレクトボックスを(フルーツ 野菜 魚)があるとします。 野菜を選ぶと二つ目のボックスに(ほうれんそう にんじん ピーマン)がでてきます。 ですがこの二つ目のセレクトボックスが全く反応しません。 下記ソースになります <body link="snow" vlink="snow" alink="snow" bgcolor onLoad="functionName()"> 食べ物選択 <select name="tabemono" onChange="functionName()"> <option value="">選択</option> <option value="野菜">野菜</option> <option value="フルーツ">フルーツ</option> <option value="魚">魚</option> </select> 種類選択 <select name="tabemono2" > </select> <script type = "text/javascript"> function functionName() { var select1 = document.forms.tabemono2.tabemono; var select2 = document.forms.tabemono2.tabemono2; select2.options.length = 0; if (select1.options[select1.selectedIndex].value == "野菜") { select2.options[0] = new Option(""); select2.options[1] = new Option("ほうれんそう"); select2.options[2] = new Option("にんじん"); } else if (select1.options[select1.selectedIndex].value == "フルーツ") { select2.options[0] = new Option(""); select2.options[1] = new Option("りんご"); select2.options[2] = new Option("なし");select2.options[3] = new Option("みかん"); } else if (select1.options[select1.selectedIndex].value == "魚") { select2.options[0] = new Option(""); select2.options[1] = new Option("あじ"); select2.options[2] = new Option("さけ"); } } </script> 実際はもっと食べ物選択、種類のデータは多いです。 お願いいたします

  • bxsliderの画像をフルサイズ表示にしたい

    bxsliderにて画像を横幅いっぱいに表示させたいのですが、うまくいきません。 具体的に言うと、 ページ読み込み時にはウインドウ幅いっぱいになっているのに、ウインドウの幅を縮めたり、広げたりすると画像が合わせて伸びてくれず、もとのままです。 何か特別な記述が必要だったりするのでしょうか? 該当のdivやimgにはwidth:100%指定しております。 やりたい事は http://icesample2.shop-pro.jp こういう事です。 カラーミーショップにて作成しております。

  • JavaScriptで選択問題作成(2)

    以前ここで問題作成の件で質問させてもらいました。 <h3>問題1</h3> <script type="text/javascript"> <!-- CheckboxProperty_Member = [ [ "福岡","FukuokaCheckbox", true ], [ "大阪","NagasakiCheckbox", false ] ] CorrectAnswer_Member = new Array( ); // 正解 document.write('九州の県は次のうちどれですか?<br>'); document.write('<br>'); document.write('<form name="KyuusyuuForm">'); for(i = 0; i<CheckboxProperty_Member.length; i++){ CorrectAnswer_Member[CheckboxProperty_Member[i][1]] = CheckboxProperty_Member[i][2]; document.write('<label><input id="'+CheckboxProperty_Member[i][1]+'" type="checkbox" onclick="HTMLDocument_CheckboxChecked_Member[this.id] = this.checked;">'+CheckboxProperty_Member[i][0]+'</label><br>'); } document.write('<br>'); document.write('<input type="button" value="解答" onclick="ClickButtonFunc( );" >'); document.write('</form>'); document.write('<br>'); document.write('<div id="Answer"></div>'); HTMLDocument_CheckboxChecked_Member = new Array( ); function ClickButtonFunc( ) { oAnswer = document.getElementById('Answer' ); var ccm = HTMLDocument_CheckboxChecked_Member; // この関数内の短縮形 Alias var check = false; // true; // var err = false; // true; // for(k in CorrectAnswer_Member){ // 厳密非等価比較 if( ccm[k]!==undefined ) check = true; // 厳密等価比較 if( ccm[k]===undefined ) ccm[k] = false; if( ccm[k]!=CorrectAnswer_Member[k] ) err = true; // ↑なぜか厳密非等価比較になるようです。 } if( ! check ){ oAnswer.innerHTML = "チェックされていません。<br>"+ "1つ以上をチェックして下さい。<br>"; }else if( err ){ oAnswer.innerHTML = "不正解です。<br>"+ "正解は「福岡」です。<br>"; }else{ oAnswer.innerHTML = "正解です。<br>"; } } --> </script> の問題を 複数ページに設置しようとしています。 しかし、上記選択問題を同じにすると もちろん問題1と問題2では連動して 問題2の解答をしたら問題1が解答されたりします。 ここ数日ずっと自分でプログラムを変更したりして修正しているのですが 解決できません。 複数選択問題を 同じページに複数問題を作成する方法を教えてください。 つまり 問題1 九州の県はどこですか? 福岡 大阪 問題2 九州の県はどこですか? 愛知 佐賀 問題3 九州の県はどこですか? 大分 長野 みたいな感じです お願いします。

  • JavaScriptで選択問題作成(2)

    以前ここで問題作成の件で質問させてもらいました。 <h3>問題1</h3> <script type="text/javascript"> <!-- CheckboxProperty_Member = [ [ "福岡","FukuokaCheckbox", true ], [ "大阪","NagasakiCheckbox", false ] ] CorrectAnswer_Member = new Array( ); // 正解 document.write('九州の県は次のうちどれですか?<br>'); document.write('<br>'); document.write('<form name="KyuusyuuForm">'); for(i = 0; i<CheckboxProperty_Member.length; i++){ CorrectAnswer_Member[CheckboxProperty_Member[i][1]] = CheckboxProperty_Member[i][2]; document.write('<label><input id="'+CheckboxProperty_Member[i][1]+'" type="checkbox" onclick="HTMLDocument_CheckboxChecked_Member[this.id] = this.checked;">'+CheckboxProperty_Member[i][0]+'</label><br>'); } document.write('<br>'); document.write('<input type="button" value="解答" onclick="ClickButtonFunc( );" >'); document.write('</form>'); document.write('<br>'); document.write('<div id="Answer"></div>'); HTMLDocument_CheckboxChecked_Member = new Array( ); function ClickButtonFunc( ) { oAnswer = document.getElementById('Answer' ); var ccm = HTMLDocument_CheckboxChecked_Member; // この関数内の短縮形 Alias var check = false; // true; // var err = false; // true; // for(k in CorrectAnswer_Member){ // 厳密非等価比較 if( ccm[k]!==undefined ) check = true; // 厳密等価比較 if( ccm[k]===undefined ) ccm[k] = false; if( ccm[k]!=CorrectAnswer_Member[k] ) err = true; // ↑なぜか厳密非等価比較になるようです。 } if( ! check ){ oAnswer.innerHTML = "チェックされていません。<br>"+ "1つ以上をチェックして下さい。<br>"; }else if( err ){ oAnswer.innerHTML = "不正解です。<br>"+ "正解は「福岡」です。<br>"; }else{ oAnswer.innerHTML = "正解です。<br>"; } } --> </script> の問題を 複数ページに設置しようとしています。 しかし、上記選択問題を同じにすると もちろん問題1と問題2では連動して 問題2の解答をしたら問題1が解答されたりします。 ここ数日ずっと自分でプログラムを変更したりして修正しているのですが 解決できません。 複数選択問題を 同じページに複数問題を作成する方法を教えてください。 つまり 問題1 九州の県はどこですか? 福岡 大阪 問題2 九州の県はどこですか? 愛知 佐賀 問題3 九州の県はどこですか? 大分 長野 みたいな感じです お願いします。

  • 2つのjavascriptを組み合わせたい

    フォームメール用の2つのjavascriptがあります。 ●2重送信防止とデータ送信後指定ページへ遷移するjavascript ●テキストボックスが空欄だった時にアラートを表示するjavascript の2つです。 この2つを組み合わせようとしたのですが、うまく動きません。 ご指導いただきたくお願いいたします。 *************************************************** 【●2重送信防止とデータ送信後指定ページへ遷移するjavascript】【動きます】 送信ボタン押下後、2重送信を防止しながら、データ送信後は「location.href = "finish.html"」でfinish.htmlを表示します。 <script type="text/javascript" src="js/jquery.js"></script> <script> jQuery(function($) { $('#form1').submit(function(event) { // HTML送信キャンセル event.preventDefault(); //フォーム要素取得 var $form = $(this); // 送信ボタンを取得 // (後で使う: 二重送信防止) var $button = $form.find('button'); // 送信 $.ajax({ url: $form.attr('action'), type: $form.attr('method'), data: $form.serialize() + '&delay=1', timeout: 10000, // 送信前 beforeSend: function(xhr, settings) { // ボタン無効二重送信防止 $button.attr('disabled', true); }, // 応答後 complete: function(xhr, textStatus) { // ボタン有効再送信許可 $button.attr('disabled', false); }, // 通信成功処理 success: function(result, textStatus, xhr) { // 入力値初期化 $form[0].reset(); location.href = "finish.html"; }, // 通信失敗処理 error: function(xhr, textStatus, error) { alert('retry');} }); }); }); </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信A"> </form> *************************************************** 【●テキストボックスが空欄だった時にアラートを表示するjavascript】【動きます】 テキストボックスが空欄だったらアラートを表示します。 <script> function check3() {   var tel3 = document.form1.tel.value;   var fax3 = document.form1.fax.value;   var isValid = true;   if (!tel3) {     alert("電話未入力");     isValid = false;   }   if (!fax3) {     alert("FAX未入力");     isValid = false;   }   if (!isValid) {     return;   }   document.form1.submit(); } </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信B" onclick="check3();"> </form> *************************************************** 【上記の2つを組み合わせてみました。】【動きません】 テキストボックスが空欄だったらアラートを表示しながら2重ボタン排除&finish.htmlに遷移というものです。 【結果】 「問題なく動くjavascript」2つを単純に組み合わせただけなのですが、 finish.htmlに遷移せずinsert.phpが表示されます。ご指導宜しくお願いします。 <script type="text/javascript" src="js/jquery.js"></script> <script> jQuery(function($) { $('#form1').submit(function(event) { event.preventDefault(); var $form = $(this); var $button = $form.find('button'); $.ajax({ url: $form.attr('action'), type: $form.attr('method'), data: $form.serialize() + '&delay=1', timeout: 10000, beforeSend: function(xhr, settings) { $button.attr('disabled', true); }, complete: function(xhr, textStatus) { $button.attr('disabled', false); }, success: function(result, textStatus, xhr) { $form[0].reset(); location.href = "finish.html"; }, error: function(xhr, textStatus, error) { alert('retry');} }); }); }); </script> <script> function check3() {   var tel3 = document.form1.tel.value;   var fax3 = document.form1.fax.value;   var isValid = true;   if (!tel3) {     alert("電話未入力");     isValid = false;   }   if (!fax3) {     alert("FAX未入力");     isValid = false;   }   if (!isValid) {     return;   }   document.form1.submit(); } </script> <form name="form1" id="form1" method="POST" name="form1" action="insert.php"> <input type="text" name="tel" value="" /> <input type="text" name="fax" value="" /> <input type="submit" value="送信B" onclick="check3();"> </form>

  • 2段階ラジオボタン後、DIVを表示したい

    色々と自力で試行錯誤しましたが、知識が足りません。 javaScriptのif構文とかswich構文の部分が問題かなぁ~と推測しますが、自力で構文を認識・改造が出来ませんので、ご指導をお願い致します。 1段目(ラジオ)<バス><電車> 2段目(ラジオ)<バス/高級><バス/普通> 2段目(ラジオ)<電車/高級><電車/普通> 3段目(DIV)<高級バス><バス><高級電車><電車> 2段目の動作がオカシイです。 連動している一方のみを表示したいです。(連動してないその他は、見えなくしたいです) 以下、ソースです。 <html> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <head> <style type="text/css"> .second , .third{ display: none; } </style> <script type="text/javascript"><!-- function AllHide() { document.getElementById('bus_high').style.display = 'none'; document.getElementById('bus_normal').style.display = 'none'; document.getElementById('train_high').style.display = 'none'; document.getElementById('train_normal').style.display = 'none'; } function SetSubMenu( idname ) { AllHide(); if( idname != "" ) { document.getElementById(idname).style.display = 'block'; } } // --></script> </head> <body> <form action=""> <label><input type="radio" name="move" value="bus" id="move_0" onClick="SetSubMenu(value);">バス</label> <label><input type="radio" name="move" value="train" id="move_1" onClick="SetSubMenu(value);">電車</label> </form> <form action=""> <div class="second" id="bus"> <label><input type="radio" name="grade" value="bus_high" id="grade_0" onClick="SetSubMenu(value);">バス/高級</label> <label><input type="radio" name="grade" value="bus_normal" id="grade_1" onClick="SetSubMenu(value);">バス/普通</label> </div> <div class="second" id="train"> <label><input type="radio" name="grade" value="train_high" id="grade_2" onClick="SetSubMenu(value);">電車/高級</label> <label><input type="radio" name="grade" value="train_normal" id="grade_3" onClick="SetSubMenu(value);">電車/普通</label> </div> </form> <div class="third" id="bus_high">高級バス</div> <div class="third" id="bus_normal">バス</div> <div class="third" id="train_high">高級電車</div> <div class="third" id="train_normal">電車</div> </body> </html>

  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • CANVASで網目模様を描く方法を教えて下さい

    添付画像のような網目模様を、CANVAS で作画する方法を探しています。 白黒で影や色づけは全くいりません。 コードの具体例をお教えいただけますでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • mqm
    • JavaScript
    • 回答数7
  • DOMへの追加方法について

    知識のある方に是非ともご教示いただきたいのですが、 以下の通りのリストがあるとしまして、 <dl id="hoge"> <dd>222</dd> <dd>333</dd> <dd>AAA</dd> <dd>AAB</dd> <dd>BBB</dd> <dd>BBC</dd> <dd>CCC</dd> <dd>CCD</dd> </dl> これらを以下のように数字から始まるなら「数字からはじまる」 Aから始まるなら「Aから始まる」と<dt>を入れたいと考えています。 且つそのdtにはlistという連番のIDをつけていきたいのですが、 どうjqueryで組めば良いか教えて頂けませんでしょうか。 実際どうしたいかというのは、以下のとおりとなります。 <dl id="hoge"> <dt id="list1">数字から始まる</dt> <dd>222</dd> <dd>333</dd> <dt id="list2">Aから始まる</dt> <dd>AAA</dd> <dd>AAB</dd> <dt id="list3">Bから始まる</dt> <dd>BBB</dd> <dd>BBC</dd> <dt id="list4">Cから始まる</dt> <dd>CCC</dd> <dd>CCD</dd> </dl> 英語に関しては、文字列の1番目を取得して、文字列の1番目 + 「から始まる」 といった形にしたいと考えています。 知識のある方、お力を貸して頂ければと思います。 宜しくお願い致します。

  • DOMへの追加方法について

    知識のある方に是非ともご教示いただきたいのですが、 以下の通りのリストがあるとしまして、 <dl id="hoge"> <dd>222</dd> <dd>333</dd> <dd>AAA</dd> <dd>AAB</dd> <dd>BBB</dd> <dd>BBC</dd> <dd>CCC</dd> <dd>CCD</dd> </dl> これらを以下のように数字から始まるなら「数字からはじまる」 Aから始まるなら「Aから始まる」と<dt>を入れたいと考えています。 且つそのdtにはlistという連番のIDをつけていきたいのですが、 どうjqueryで組めば良いか教えて頂けませんでしょうか。 実際どうしたいかというのは、以下のとおりとなります。 <dl id="hoge"> <dt id="list1">数字から始まる</dt> <dd>222</dd> <dd>333</dd> <dt id="list2">Aから始まる</dt> <dd>AAA</dd> <dd>AAB</dd> <dt id="list3">Bから始まる</dt> <dd>BBB</dd> <dd>BBC</dd> <dt id="list4">Cから始まる</dt> <dd>CCC</dd> <dd>CCD</dd> </dl> 英語に関しては、文字列の1番目を取得して、文字列の1番目 + 「から始まる」 といった形にしたいと考えています。 知識のある方、お力を貸して頂ければと思います。 宜しくお願い致します。

  • jquery.csv2table.jsのテーブル

    CSVの会員名簿を読み込み、表にしてWEBに表示する為にjquery.csv2table.jsを使った こちらのサイトを参考にさせて頂きました。 http://jsgt.org/lib/jquery/plugin/csv2table/v002/test.htm CSVを読み込み、表示は成功したのですが。 もともとのCSVデータが横長に項目が多い為 表示されるテーブルは横長の表となってしまいます。 出来れば一行をセルの結合で2段にまとめて表示したいと思っています。 <td colspan="2"><td rowspan="2">を使って [1]はココに表示[2]はココに表示するみたいにテンプレ化して表示できればと思っていますが セルの背景色は変更できてもセルの場所を任意に変更できません やはりそういった事は難しいのでしょうか どなたか詳しい方、教えて頂けますと幸いです。 よろしく願い致します。

  • jquery.csv2table.jsのテーブル

    CSVの会員名簿を読み込み、表にしてWEBに表示する為にjquery.csv2table.jsを使った こちらのサイトを参考にさせて頂きました。 http://jsgt.org/lib/jquery/plugin/csv2table/v002/test.htm CSVを読み込み、表示は成功したのですが。 もともとのCSVデータが横長に項目が多い為 表示されるテーブルは横長の表となってしまいます。 出来れば一行をセルの結合で2段にまとめて表示したいと思っています。 <td colspan="2"><td rowspan="2">を使って [1]はココに表示[2]はココに表示するみたいにテンプレ化して表示できればと思っていますが セルの背景色は変更できてもセルの場所を任意に変更できません やはりそういった事は難しいのでしょうか どなたか詳しい方、教えて頂けますと幸いです。 よろしく願い致します。