回答数
気になる
-
配列の1要素を代入した変数を使って元の配列要素を削除できるか
いつもお世話になっています。 配列の1要素を代入した変数を使って、元の配列要素を削除できますか。 例えば、 const arr = [{typ: '肉', nam: 'ステーキ'}, {typ: '肉', nam: 'ハンバーグ'}], elm = arr[i] とした時、後からelmを使ってarrの要素を削除するにはどうすれば良いですか。
質問日時: 2023/07/28 03:34 質問者: zyousuke
ベストアンサー
1
0
-
Google scriptについて 至急scriptを作成して欲しいです! 現在、Googlefor
Google scriptについて 至急scriptを作成して欲しいです! 現在、GoogleformのGASから送信後、指定されたスプレッドシートを複製して、その複製したシートに送った回答内容を記載するというGASを作成しているのですが、複製までは上手く行きましたが、フォームの回答を複製したスプレッドシートに記入が上手く行きません! 1回解答する度に新たな複製したシートに回答を記入するscriptを書いて頂きたいです!! 【要は1つの回答を1つのスプレッドシートで保存したいです】 よろしくお願い致します!!
質問日時: 2023/07/01 20:08 質問者: keyITH
解決済
1
0
-
addEventListener()でリスナー関数に名前を付ける構文を教えてください
いつもお世話になっています。 addEventListener()でリスナー関数に名前を付ける構文を教えてください。 例えば、 document.addEventListener('keydown', fnc = (e) => {console.log(e.key)}) のように書けば、後でリスナー関数を参照できる事までは分かったのですが、 これを、変数を使わずに、 addEventListener('keydown', function fnc(e) {console.log(e.key)}) のような書き方は出来ますか??? ちなみにこの書き方だと、後で参照しようとするとfnc is not definedとなります。
質問日時: 2023/07/01 17:31 質問者: zyousuke
ベストアンサー
1
0
-
4
セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています
javascript 2つのセレクトボックスを全て選択されていないと、「テキストによるエラーメッセージを表示させるコード」を調べています。 該当コードは<script>■■四角の記号の部分です。 セレクトボックスを2つとも未選択でsubmitを押すと、アラートのメッセージとテキストエラーによるメッセージ2つが同時に表示されるようになっています。 コードはきちんと起動します。 該当部分のdocument.querySelector('.err')?.remove();の意味が理解できずにいます。 insertAdjacentHTMLで出したテキストエラーをセレクトボックスが空欄でない時に非表示にするとい解釈のようですが、あってますでしょうか? class名やid名に('.err')?という名前は使用していませんがドットに.errとクエスチョンマーク?とはどういう意味なのでしょうか? 条件演算子の?でしょうか条件演算子の構文で変数 = 条件 ? 値1 : 値2;の構文とも違うようですし。 分からずにいます。回答よろしくお願いいたします。 ---HTMLのコード--- <body> <form action="form1.php" method="post" id="form"> 選択項目①: <select id="fruits" class="select1" name="fruits"> <option value="">果物を選択する</option> <option value="リンゴ">>リンゴ</option> </select> 選択項目②: <select id="fruits2" class="select1" name="fruits2"> <option value="">食事を選択する</option> <option value="ごはん">>ごはん</option> </select> <div class="alert15"></div><!--alert15 2つのフォーム全て記入がない場合ここにテキストエラーを表示する--> <button id="submit" class="yohaku"> </button> </form> ---javascriptののコード--- <script> const form = document.querySelector('#form'); const fruits = document.querySelector('#fruits'); const fruits2 = document.querySelector('#fruits2'); // セレクトボックスを選択されてないとアラートによるエラーメッセージを表示 form.addEventListener('submit', function(event) { let msg = ""; if (fruits.value == "") msg += "選択項目①:※選択項目①を選択して下い。\n"; if (fruits2.value == "") msg += "選択項目②:※選択項目②を選択してください。\n"; if (msg != "") { event.preventDefault(); alert(msg); } }); </script> ■■ <script> // 2つとも全て選択されてないとテキストによるエラーメッセージの表示 form.addEventListener('submit', e=>{ document.querySelector('.err')?.remove(); document.querySelector('.alert15').insertAdjacentHTML('afterend',`<span class="err">※選択項目①と選択項目②を全て選択して下さい。</span>`); },true); </script> </body>
質問日時: 2023/06/22 15:48 質問者: hayosato
ベストアンサー
2
0
-
5
sessionStorageを調べています。
入力フォームに入力された値をsubmitを押したら、次の確認画面から前のページに戻った時も、入力されているデータを保持するコード書いています。 以下は調べたコードですが、コードの意味は大まかに把握できていますが、sessionStorageにデータを保存するまでの流れを正確に理解できていません。 <script>タグ内に▼三角の記号部分のコードはsesstionStorageにデータを保存するために、この場合▼の部分のコードは必要なのでしょうか? また、♦の部分を指定するには、まず最初に、■の部分のコードを書かなければいけないという解釈であっていますでしょうか? ※PHPはを使った方がよいですが、今は練習なので、使っていません。 ---HTMLのコード--- <body> <form action="form1.php" method="post" id="form"> 名前:<input type="text" class="form1" name="name" id="name" value="" /> ふりがな:<input type="text" class="form1" name="furigana" id="furigana" value="" /> 選択: <select id="fruits" class="select1" name="fruits"> <option value="">果物を選択する</option> <option value="">リンゴ</option> </select> <button id="submit" class="yohaku"> </button> </form> </body> ---javascriptのコード--- <script> ▼const key = 'date_key'; ▼const form = document.querySelector('#form'); ▼const name = document.querySelector('#name'); ▼const furigana = document.querySelector('#furigana'); form.addEventListener('change', function() { ♦if (name.value != "") sessionStorage.setItem('name', name.value); ♦if (furigana.value != "") sessionStorage.setItem('furigana', furigana.value); ♦if (fruits.value != "") sessionStorage.setItem('fruits', fruits.value); }); let val1 = sessionStorage.getItem('fruits'); if(val1!== null)fruits.value = val1; ■name.value = sessionStorage.getItem('name'); ■furigana.value = sessionStorage.getItem('furigana'); </script>
質問日時: 2023/06/20 12:41 質問者: hayosato
ベストアンサー
1
0
-
6
アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします
ファイルのアップロード機能を作成していて、アップロードする場所にカメラの画像を配置しているのですが、ファイルをアップロードするとカメラ画像の下に画像や動画やpdfが表示されてしまうため、 カメラ画像の上にアップロードファイルを表示したいと考えております。 画像、動画、PDFで分岐するコードを書きたい場合、どのように書けばよいのでしょうか? <style> /* 通常時 */ form > div { display: flex; } .contents-selector-button { position: relative; margin: .3em; } .contents-selector-button label img {/*カメラ画像に対してのcss*/ width: 200px; height: 100px; } .contents-selector-button input { display: none; } /* 画像、動画、PDF表示時のレイアウト */ .contents-selector-button.contents-on label { visibility: hidden; } .contents-selector-button.contents-on .viewer { position: absolute; top:0; left: 0; width: 100%; height: 100px; overflow: hidden; } </style> </head> <body> <form method="post"> <div> <div class="contents-selector-button"> <label> <div><img src="img/camera.jpg"></div> <input type="file" accept=".png, .jpg, .jpeg, .pdf, .mp4"> </label> <input type="hidden"> <button type="button">clear</button> <div class="viewer"></div> </div> </div> </form> <script> (()=>{ const fileTypes = ['image/jpeg','image/png','video/mp4','application/pdf'], wrap = document.querySelector('form > div'), P = e => e.closest('.contents-selector-button'), V = e => P(e).querySelector('.viewer'), C = (e, s) => P(e).classList[s]('contents-on'); for(let i = 0; i<3; i++) wrap.appendChild(wrap.firstElementChild.cloneNode(1)); /* クリアボタン */ wrap.addEventListener('click', (e, t = e.target) => { if(t.nodeName != 'BUTTON' || t.type != 'button') return; V(t).innerHTML = ''; C(t, 'remove'); }); /* 画像、動画、PDF登録 */ wrap.addEventListener('change', (e, t = e.target) => { if(t.nodeName != 'INPUT' || t.type != 'file') return; if(t.files.length == 0 || !fileTypes.includes(t.files[0].type)) return; /* ここから分岐させたい */ /* 画像の場合 */ wrap.addEventListener('change', (e, t = e.target) => { if(t.nodeName != 'INPUT' || t.type != 'file') return; if(t.files.length == 0 || !fileTypes.includes(t.files[0].type)) return; const img = document.createElement('img'); img.src = URL.createObjectURL(t.files[0]); img.style.height = '100px'; V(t).appendChild(img); C(t, 'add'); }); })(); /* 動画の場合 */ wrap.addEventListener('change', (e, t = e.target) => { if(t.nodeName != 'INPUT' || t.type != 'file') return; if(t.files.length == 0 || !fileTypes.includes(t.files[0].type)) return; const img = document.createElement('video'); video.src = URL.createObjectURL(t.files[0]); video.style.height = '100px'; V(t).appendChild(video); C(t, 'add'); }); })(); /* PDFの場合 */ wrap.addEventListener('change', (e, t = e.target) => { if(t.nodeName != 'INPUT' || t.type != 'file') return; if(t.files.length == 0 || !fileTypes.includes(t.files[0].type)) return; const img = document.createElement('pdf'); video.src = URL.createObjectURL(t.files[0]); video.style.height = '100px'; V(t).appendChild(pdf); C(t, 'add'); }); })(); </script>
質問日時: 2023/06/17 19:12 質問者: 初心者サイト作成
解決済
4
0
-
7
clear機能を失わずにファイルアップロード機能を作成したい
ファイルのアップロード機能を作成していて、アップロードする場所にカメラの画像を配置しているのですが、ファイルをアップロードするとその下に画像や動画やpdfが表示されてしまいます。 ファイルを選択したあと?アップロード後?にカメラの画像を見えなくしてその上からアップロードファイルを表示することは出来ますでしょうか? ※参考サイト http://www.irasuto.cfbx.jp/掲示板テスト/ <form method="post"> <div class="image-partial"> <h2>動画・画像をアップロード(Upload video・image)<span class="required">※ファイルサイズ15MB以内、JPG/GIF/PNG/MP4</span></h2> <div class="image-selector-button"> <label> <div class="image-camera-icon"> <img src="<?php echo $camera_url; ?>" style="height: 100px;"> </div> <input type="file" class="attach" name="attach[]" accept=".png, .jpg, .jpeg, .pdf, .mp4" style="display: none;"> </label> <input type="hidden" class="attachdel" name="attachdel[]"> <button type="button" class="attachclear">clear</button> <div class="viewer"><?php echo $attach[0]; ?></div> </div> <div class="image-selector-button"> <label> <div class="image-camera-icon"> <img src="<?php echo $camera_url; ?>" style="height: 100px;"> </div> <input type="file" class="attach" name="attach[]" accept=".png, .jpg, .jpeg, .pdf, .mp4" style="display: none;"> </label> <input type="hidden" class="attachdel" name="attachdel[]"> <button type="button" class="attachclear">clear</button> <div class="viewer"><?php echo $attach[1]; ?></div> </div> </div> </form> <script> const attach = document.querySelectorAll('.attach'); const del = document.querySelectorAll('.attachdel'); const clear = document.querySelectorAll('.attachclear'); const viewer = document.querySelectorAll('.viewer'); for (let i = 0; i < attach.length; i++) { attach[i].addEventListener('change', () => { if (attach[i].files[0].size > 15 * 1024 * 1024) { alert('ファイルサイズが 15MBバイトを超えています'); return; } del[i].value = ""; viewer[i].innerHTML = ""; if (attach[i].files.length !== 0) { const reader = new FileReader(); reader.onload = () => { var child = null; if (reader.result.indexOf("data:image/jpeg;base64,") === 0 || reader.result.indexOf("data:image/png;base64,") === 0) { child = document.createElement("img"); } else if (reader.result.indexOf("data:video/mp4;base64,") === 0) { child = document.createElement("video"); child.setAttribute("controls", null); } else if (reader.result.indexOf("data:application/pdf;base64,") === 0) { child = document.createElement("iframe"); } else { alert("対象外のファイルです"); alert(reader.result); attach[i].value = ""; } if (child !== null) { child.style.height = "100px"; child.src = reader.result; viewer[i].appendChild(child); } }; reader.readAsDataURL(attach[i].files[0]); } }); clear[i].addEventListener('click', () => { attach[i].value = ""; del[i].value = "1"; viewer[i].innerHTML = ""; }); } </script>
質問日時: 2023/06/10 16:12 質問者: 初心者サイト作成
ベストアンサー
3
0
-
8
二次元配列の全要素の全要素を区切り文字無しで連結する最も単純な書き方を教えてください
いつもお世話になっています^^; 例えば[[0, 1], [2, 3]]という二次元配列の全要素の全要素を区切り文字無しで連結して、 '0123'という文字列を得るにはどのように書けばよろしいですか。 join('')だと'0,12,3'となってしまいます。
質問日時: 2023/06/09 12:51 質問者: zyousuke
ベストアンサー
3
0
-
9
任意の変数が任意の値になった瞬間に停止して該当コードを表示する事はできますか
いつもお世話になっています。 DevToolsの機能などで、任意の変数が任意の値になった瞬間に停止して該当コードを表示する事はできますか。 そのやり方を教えてください。 変数の値がいつの間にかNaNになっていて、しかも再現性が無く同じ操作をしても大丈夫な時もあり、これが、いつどこで発生しているのか突き止めたいのです。
質問日時: 2023/05/22 16:19 質問者: zyousuke
ベストアンサー
1
0
-
10
オブジェクト配列の各メンバを任意の式で評価して、その評価値が最大のオブジェクトを返す関数はありますか
いつもお世話になっています。 オブジェクト配列の各メンバを任意の式で評価して、その評価値が最大のオブジェクトを返す関数はありますか。 例えば、オブジェクト配列の各メンバが、二次元の位置情報を持っているとして、現在地からの直線距離が最も近いオブジェクトを取得する処理を、なるべく短いコードで書くにはどうすればよいですか。
質問日時: 2023/05/20 15:02 質問者: zyousuke
ベストアンサー
2
0
-
11
インスタグラムのapiを利用して ID情報を持ってきて 自前のサーバでゲームサービスとか できますか
インスタグラムのapiを利用して ID情報を持ってきて 自前のサーバでゲームサービスとか できますか? (ID管理自体はこちらでやらなくても いいかな?と言う怠慢な考えです。) ゲームのスコアなどを自前のサーバで 管理したいと言うわけです。 特にインスタにこだわっているわけでは ありません。
質問日時: 2023/05/12 16:10 質問者: ss2400
ベストアンサー
1
0
-
12
API連携のプログラミングについて(Typescript)
教えてください。 初心者です。 API連携のJavascript系のプログラミングで よくTypescriptで書かれているのを見るのですが、 それはAPI連携に限らずでしょうか? RestAPI, JSON形式でのファイルの取得にコードの行数が少なくて済むからとか、誰にも分かりやすい書き方になるからでしょうか?
質問日時: 2023/05/03 11:00 質問者: ymoshimoshi
解決済
2
0
-
13
イラストレーター、縦中横のショートカットをスクリプトを使って作成する方法
イラストレーターで縦中横のショートカット作成したくて、 1. AutoHotkey 2. ↓こちらのページにあるスクリプト https://sttk3.com/blog/tips/illustrator/airstyle-tatechuyoko.html を組み合わせれば出来ると思ってダウンロードしてみましたが、ここから先がわかりません。 具体的な方法を教えていただける方いらっしゃいましたら、よろしくお願いいたします。 m(__)m
質問日時: 2023/04/19 11:15 質問者: 1973kanda
解決済
1
0
-
14
jsで診断コンテンツのページ内切り替えについて
とあるサイトを参考に、ソースまでは作ってみたのですが、jsについては難易度が高すぎて先に進めずつまずいております。どなたかご教授いただけませんでしょうか。 よろしくお願い致します。 【内容】 質問数:4段階 Q1の選択数:2⇒1か2選択で「次へ」ボタンが押せるようになりQ2へ Q2の選択数:3⇒1~3どれか選択で「次へ」ボタンが押せるようになりQ3へ Q3の選択数:3⇒1~3どれか選択すると、選択項目の下にコンテンツ(1種類)が表示され「次へ」ボタンが押せるようになりQ4へ Q4の選択数:4⇒1~4どれか選択すると、選択項目の下に選択に合った内容のコンテンツが表示され「次へ」ボタンが押せるようになり最後のサンクス表示 文字数が多くてソースが貼り付けられませんでしたため、構成を作ったソースは画像として添付致しました。
質問日時: 2023/04/14 17:31 質問者: h_6812_h
解決済
1
0
-
15
その要素がjQueryでremove()済みか確認する最も簡単な方法
いつもお世話になっています。 その要素がjQueryでremove()済みか確認する最も簡単な方法を教えてください。 小生が考えたのは、foo.css('display')で確認する方法ですが、'display'という文字列を渡すのが、ちょっとダサいなと思っています。 もっときれいな書き方でスマートに確認する方法はありますか。
質問日時: 2023/04/05 20:26 質問者: zyousuke
ベストアンサー
2
0
-
16
ステップ実行で式の中の各演算が実行される様子を1個1個確認する方法
いつもお世話になっています。 DevToolsのステップ実行などで、式の中の各演算を1個1個確認するにはどうすればよいですか。 例えば、 1 + 1 + 1 なら、まず左の1 + 1が評価されて2 + 1となりますが、 この2 + 1となる過程を観察するツールはありますか。 またはDevToolsでのやり方があれば教えてください。
質問日時: 2023/04/03 12:25 質問者: zyousuke
ベストアンサー
1
0
-
17
test.jsの関数testから別のtest2.jsの関数testをよびだす方法はどのようにするので
test.jsの関数testから別のtest2.jsの関数testをよびだす方法はどのようにするのでしょうか。
質問日時: 2023/03/30 11:11 質問者: piraniaman
解決済
3
0
-
18
「?」の意味
javascriptのコードの模写をしていたのですが、その中で「?」という記号?演算子?がでてきたのですが調べても意味が出てきません。教えていただけますでしょうか。
質問日時: 2023/03/18 08:48 質問者: ジョジョん
ベストアンサー
4
0
-
19
Google reCAPTCHAについて
フォームからのスパムが多く、自分でGoogle reCAPTCHAを設定してみようとサイトを参考にして、以下を</form>タグの後に記述しました。 ところがスパムの数は減らずGoogle cloudには「過去6週間にトークンをリクエストしていません」と出ます。 これは設定方法に問題があるという事だと思います。 <script src="https://www.google.com/recaptcha/api.js?render=6LcdYmYkAAAAALxCMuxsHdGOXGidatwn27uI5R-o"></script> <script> var rc_form = document.getElementById('rc_form'); //フォーム要素にイベントハンドラを設定 rc_form.onsubmit = function(event) { //デフォルトの動作(送信)を停止 event.preventDefault(); //トークンを取得 grecaptcha.ready(function() { grecaptcha.execute('6LcdYmYkAAAAALxCMuxsHdGOXGidatwn27uI5R-o', {action: 'login'}).then(function(token) { var token_input = document.createElement('input'); //input 要素を生成 token_input.type = 'hidden'; token_input.name = 'g-recaptcha-response'; token_input.value = token; //トークンを値に設定 rc_form.appendChild(token_input); var action_input = document.createElement('input'); //input 要素を生成 action_input.type = 'hidden'; action_input.name = 'action'; action_input.value = 'login'; //アクション名を値に設定 rc_form.appendChild(action_input); rc_form.submit(); //フォームを送信 }); }); } </script> どこに問題があるか、ご指導頂けないでしょうか? ドメインの設定は大丈夫だと思われます。サイトに「Google reCAPTCHAで保護されています」のマークも付いています。
質問日時: 2023/02/22 14:37 質問者: みっきー0520
ベストアンサー
1
0
-
20
React と Electron でデスクトップアプリを開発する環境について
お世話になります JavaScriptでデスクトップアプリを開発したく React と Electron の勉強を始めました 書籍を参考にしているのですが 最初の簡単な動作確認的なところで躓いています Hello!Worldをブラウザに表示するというだけなのですが React の npm start では、問題ありません Electron の npm run electron-start で、アプリのウィンドウが表示されません npm run build で、出来たdist内のアプリを起動すると問題ありません 念のため、React と Electron で検索してみたのですが Reactのプロジェクトの初期画面をアプリ化するものも、同様に React の npm start や buildするとうまくいくけれど Electron の npm run electron-startは、駄目という状況です npm run electron-startの際にWindows10のセキュリティ的な制約で開かないのかもしれません 個別のレアなケースなのかもしれませんが情報ありましたらご教示ください
質問日時: 2023/02/08 11:16 質問者: HiroBlue
解決済
1
0
-
21
スマフォではボタンを表示させたくない
HTML/CSS/Javascriptを利用してボタンを表示さています。 スマフォの場合、ボタンを表示させたくなく、どうにかJSを修正してみたのですが、ページ読み込み時に一瞬だけボタンが表示されます。 完璧に表示されなくする為にはどのようにJSを修正したらよろしいでしょうか。 恐縮ではございますがどなたかお願いいたします。 ■HTML <p id="page-top"><a href="index.html#top">PAGE TOP</a></p> ■CSS #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; } #page-top a { background: #e94609; text-decoration: none; color: #fff; width: 100px; padding: 30px 0; text-align: center; display: block; border-radius: 5px; border: 1px solid white; } #page-top a:hover { text-decoration: none; background: #ee8a66; } Javascriptをどうにか修正しようとしています。 ■下記、WEBで検索して見つかったもの $(function() { var showFlag = false; var topBtn = $('#page-top'); topBtn.css('bottom', '-100px'); var showFlag = false; //スクロールが100に達したらボタン表示 $(window).scroll(function () { if ($(this).scrollTop() > 100) { if (showFlag == false) { showFlag = true; topBtn.stop().animate({'bottom' : '20px'}, 200); } } else { if (showFlag) { showFlag = false; topBtn.stop().animate({'bottom' : '-100px'}, 200); } } }); //スクロールしてトップ topBtn.click(function () { $('body,html').animate({ scrollTop: 0 }, 500); return false; }); ■修正後 $(function() { var showFlag = false; var topBtn = $('#page-top'); if (window.matchMedia('(max-width: 767px)').matches) { topBtn.hide(); } topBtn.css('bottom', '-100px'); var showFlag = false; //スクロールが100に達したらボタン表示 $(window).scroll(function () { if ($(this).scrollTop() > 100) { if (showFlag == false) { showFlag = true; topBtn.stop().animate({'bottom' : '20px'}, 200); } } else { if (showFlag) { showFlag = false; topBtn.stop().animate({'bottom' : '-100px'}, 200); } } }); //スクロールしてトップ topBtn.click(function () { $('body,html').animate({ scrollTop: 0 }, 500); return false; }); });
質問日時: 2023/01/20 14:26 質問者: エビゾー
ベストアンサー
2
0
-
22
jquery 診断コンテンツにチェックボックスを付けたいです
jquery勉強中です。 診断コンテンツ作成を試みているのですが、作り方がわからないのでどなたか助けていただけますでしょうか。 やりたいことは、項目を選択して次へボタンで次の質問に進むのですが、項目を選択する際、チェックボックスを使いたいです。 ようやく見つけたサンプルページがあるのですが、このような仕組みにチェックボックスを付けたいです。 下記サンプルページです。 https://b-risk.jp/blog/2022/04/yes-no-contents/ どなたかご教示くださいますと幸いです。 よろしくお願い致します。
質問日時: 2023/01/19 18:31 質問者: h_6812_h
解決済
3
0
-
23
定積分の近似値を計算する関数composite_newton_cotesをつくりたい
以下のプログラムで実行したのですがfunction newton_cotes(f,intv,n*m){ の部分でコンパイルエラーが出てしまいます。原因が分かる人いませんか? WScript.Echo("第一段階で何等分しますか?"); var n = Number(WScript.StdIn.ReadLine()); WScript.Echo("第二段階で何等分しますか?"); var m = Number(WScript.StdIn.ReadLine()); var intv = [0,2]; var approx1 = newton_cotes(f,intv,n*m); var approx2 = composite_newton_cotes(f,intw,n,m); var exact = Math.PI; WScript.Echo("近似値1は " + approx1); WScript.Echo("近似値2は " + approx2); WScript.Echo("厳密値は " + exact); WScript.Echo("近似値1との誤差は " + Math.abs(approx1 - exact)); WScript.Echo("近似値1との誤差は " + Math.abs(approx2 - exact)); function composite_newton_cotes(f,intv,n,m){ var h=(intv[1]-intv[0])/n; var finer_intv = [intv[0],intv[0]+h]; var approx = 0; for(var i=0;i<n;i++){ approx += newton_cotes(f,finer_intv,m); finer_intv[0] += h; finer_intv[1] += h; } return approx; } function newton_cotes(f,intv,n*m){ var h=(intv[1]-intv[0])/n*m; var v = compute_weight(n*m); var x = intv[0]; var approx = 0; for(var i=0;i<=n*m;i++){ approx += f(x)*v[i]; x += h; } return approx*h; }
質問日時: 2023/01/18 14:09 質問者: なるはた
解決済
1
0
-
24
画面に表示したらアニメーションを開始したい
border-bottomをアニメーションで出すようにCSSを書きました。 画面上に表示されたら、アニメーションを開始するようにjsで制御したのですがうまくできません。 どのようにしたらよろしいでしょうか。 ■HTML <h2 class="border">期間限定商品</h2> ■CSS .border{ position: relative; } h2.border:before{ content: ''; position: absolute; left: 50%; bottom: 0; width: 0; border-bottom: solid 2px #e94609; transform: translateX(-50%); animation: border_anim 3s linear forwards; } @keyframes border_anim { 0%{ width: 0%; } 100%{ width: 100%; } }
質問日時: 2023/01/13 15:38 質問者: エビゾー
ベストアンサー
3
0
-
25
Typescript が必要な理由
教えてください。 プログラミング初心者です。 あるシステムでtypescriptとexpressを使ってWebアプリケーションのプログラムがあり、MySQLのデータベースに書き込む処理があります。 Typescriptを使っている理由が明確に分からないのですが、SQLを使っていない場合にデータベースのテーブルの型に合わせるのに有効なのでしょうか?例えばPrismaなどを間に入れて書き込み処理をさせたりする場合など。 他のデータベースに切り替えたりする場合などにも有効でしょうか?
質問日時: 2023/01/07 11:45 質問者: ymoshimoshi
解決済
1
1
-
26
最小二乗法
Math.rand関数を使い xi(i = 1,2, ... , 1000) に [-0.1,0.1) から一様分布で値を代入すsi, (xi, x²i e^xi) をデータとして最小二乗法によりデータとの誤差が最小になる五次式を求めるプログラムを教えてください
質問日時: 2023/01/01 20:57 質問者: なるはた
解決済
2
0
-
27
画像の表示位置
下記のソースはネットにあった物で、私が少しアレンジしたものです。 15枚のjpg画像を4秒おきに変化する様にしましたが、 表示する位置を変えたいのです。 縦横それぞれ何処を変えれば変わるのでしょうか? <script type="text/javascript"><!-- function myFunc(){ myD = new Date(); myS = myD.getSeconds(); if ( myS >= 0){ myImg = "00"; } if ( myS >= 4){ myImg = "04"; } if ( myS >= 8){ myImg = "08"; } if ( myS >= 12){ myImg = "12"; } if ( myS >= 16){ myImg = "16"; } if ( myS >= 20){ myImg = "20"; } if ( myS >= 24){ myImg = "24"; } if ( myS >= 28){ myImg = "28"; } if ( myS >= 32){ myImg = "32"; } if ( myS >= 36){ myImg = "36"; } if ( myS >= 40){ myImg = "40"; } if ( myS >= 44){ myImg = "44"; } if ( myS >= 48){ myImg = "48"; } if ( myS >= 52){ myImg = "52"; } if ( myS >= 56){ myImg = "56"; } document.body.background = myImg + ".jpg"; } setInterval("myFunc()",100); // --></script><!--HPB_SCRIPT_ROV_50 // // (C) 2010 株式会社ジャストシステム // // HpbImgPreload: // function HpbImgPreload() { var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC||isN6||isIE) { if (document.images) { var imgName = HpbImgPreload.arguments[0]; var cnt; swImg[imgName] = new Array; for (cnt = 1; cnt < HpbImgPreload.arguments.length; cnt++) { swImg[imgName][HpbImgPreload.arguments[cnt]] = new Image(); swImg[imgName][HpbImgPreload.arguments[cnt]].src = HpbImgPreload.arguments[cnt]; } } } } // HpbImgFind: // function HpbImgFind(doc, imgName) { for (var i=0; i < doc.layers.length; i++) { var img = doc.layers[i].document.images[imgName]; if (!img) img = HpbImgFind(doc.layers[i], imgName); if (img) return img; } return null; } // HpbImgSwap: // function HpbImgSwap(imgName, imgSrc) { var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC||isN6||isIE) { if (document.images) { var img = document.images[imgName]; if (!img) img = HpbImgFind(document, imgName); if (img) img.src = imgSrc; } } } var swImg; swImg=new Array; //--> <style> <!-- body{ background-repeat:no-repeat; } --> </style> </head> <body bgcolor="#000000" text="#0f3700" link="#fa5000" vlink="#808080" alink="#008080"> <div style="top : 223px;left : 50px; position : absolute; z-index : 2; " id="Layer6"></div> <div style="top : 417px;left : 423px; position : absolute; z-index : 7; width : 77px; height : 15px; " id="Layer24"></div> <div style="top : 434px;left : 397px; position : absolute; z-index : 3; " id="Layer14"></div> <div style="top : 451px;left : 431px; position : absolute; z-index : 4; " id="Layer16"></div> <div style="top : 50px;left : 50px; position : absolute; z-index : 5; " id="Layer18"></div> <div style="top : 50px;left : 50px; position : absolute; z-index : 6; " id="Layer19"></div> <div style="top : 8px;left : 8px; position : absolute; z-index : 1; " id="Layer1"> <div id="player"></div> </div> <div style="width : 30px;height : 12px;top : 27px;left : 8px; position : absolute; z-index : -1; " id="Layer2"> <div style="width : 372px;height : 17px;top : 8px;left : 8px; position : absolute; z-index : 1; " id="Layer5">script type="text/javascript" language="JavaScript"> </div> </div> </body> </HTML>
質問日時: 2022/12/23 08:25 質問者: 2021五郎蔵
ベストアンサー
3
0
-
28
ソースコードのいじる場所が分かりません。
ネットで雪を降らすソースコードがありました。 試しにホームページビルダーを使って コピーして見たら縦横の寸法が凄く小さい。 横は引っ張ったら伸ばせましたが、縦幅が大きくなりません。 下記のソースコードで何処を操作したら、大きくなるのでしょうか? <html lang="ja"> <head> <meta charset="UTF-8"> <title>snowPowder</title> <style> * { margin: 0; padding: 0; } #main__container { width: 100%; height: 300px; background-color: #000; overflow: hidden; display: flex; justify-content: space-around; transition-duration: 0.1s; transition-timing-function: ease; } </style> </head> <body> <div id="main__container"></div> <script> var winWidth = document.documentElement.clientWidth, //ウィンドウの横幅 winHeight = document.documentElement.clientHeight; //ウィンドウの高さ var main = document.getElementById('main__container'); for (var i = 1; i <= 40; i++) { var div = document.createElement('div'); //divを作成 main.appendChild(div); //divを追加 div.setAttribute('id', 'contents' + zeroPad(i)); div.setAttribute('style', 'position:relative; background-color:#fff; border-radius:50%; top:-30px;'); randomValue(div); } function randomValue(ele) { var multiArray = [1, -1]; //1か-1の配列 var randomMulti = multiArray[Math.floor(Math.random() * multiArray.length)]; //1か-1をランダムに取得 var maxSize = 9, //最大サイズ minSize = 3, //最小サイズ objSize = getRandomNum(maxSize, minSize), //サイズ 最大〜最小までのランダム値 blurValue = getRandomNum(3, 0), //ボカシ量 opacityValue = getRandomFloot(0.8, 0.5).toFixed(1), //透明度 ※小数点第1位まで取得 XSpeedNum = getRandomFloot(2, 0), //Xの移動量 YSpeedNum = getRandomFloot(4, 2), //Y座標の移動量 ZSpeedNum = getRandomFloot(0.025, 0); //Z座標の移動量 ele.style.width = objSize + 'px'; ele.style.height = objSize + 'px'; ele.style.margin = (maxSize - objSize) / 2 + 'px'; ele.style.filter = 'blur(' + blurValue + 'px)'; ele.style.opacity = opacityValue; var YNum = -40; var XNum = 0; var ZNum = 0; (function animeLoop() { var requestAnime = window.requestAnimationFrame(animeLoop); XNum += XSpeedNum; YNum += YSpeedNum; ZNum += ZSpeedNum; ele.style.top = YNum + 'px'; ele.style.left = XNum * randomMulti + 'px'; ele.style.transform = 'scale(' + ZNum + ',' + ZNum + ')'; if (YNum >= 300) { window.cancelAnimationFrame(requestAnime); return randomValue(ele); } })(); return ele; } //////////// 関数 //////////// function zeroPad(zeroNum) { //ゼロパッド取得関数 var zeroNum = ('000' + zeroNum).slice(-3); return zeroNum; } function getRandomNum(max, min) { //ランダム値取得関数 var ranNum = Math.floor(Math.random() * (max + 1 - min) + min); return ranNum } function getRandomFloot(max, min) { //ランダム値取得関数 小数点第1位 var ranFlootNum = Math.random() * (max - min) + min; return ranFlootNum; } </script> </body> </html>
質問日時: 2022/12/23 02:06 質問者: 2021五郎蔵
ベストアンサー
1
0
-
29
台形公式
これをもとにf(x)=loge(4x²+1)の[0,1/2]の定積分を近似するプログラミングを台形公式を使い書け var n = WScript.StdIn.ReadLine(); n = Number(n); var a = 0; var b = Math.PI; var intv = [a,b]; var approx = trapezoid_approx(Math.sin,intv,n); var exact = -Math.cos(b) + Math.cos(a); WScript.Echo("近似値: " + approx); WScript.Echo("厳密値: " + exact); function trapezoid_approx(f, intv, n){ var delta = (intv[1]-intv[0])/n; var approx = 0; var left = intv[0]; var right = left + delta; for(var i=0; i < n; i++){ approx += delta*(f(left) + f(right))/2; left += delta; right += delta; } return approx; }
質問日時: 2022/12/21 18:38 質問者: なるはた
ベストアンサー
2
0
-
30
自作ゲームのaiについて
画像のような、棒でボールを跳ね返して、跳ね返し損なたら負けというゲームを作っています。 現在は、対戦相手を自動で動かしていて、確実にボールを跳ね返してくるようになっています。 対戦相手に人間らしくミスをさせるのはどうすればいいですか。
質問日時: 2022/12/13 20:22 質問者: シワメロン
解決済
2
0
-
31
htmlとcssに関する質問です
display:inline-block;で横向きのcssを作成してたのですがうまく横向きにならず困ってます 教えてください htmlのコードがこちらです body> <figure class="side_image"> <img src="onryouri.jpg" alt="料理"> </figure> <p class="side"> 料理教室へようこそ </p> <div class="maruneko"> <img class="maruneko" src="maruneko.jpg" alt="まるい猫"> </div> <p class="side2"> 丸い猫</p> cssはこちらです figure.side_image{ display:inline-block; } p.side{ display:inline-block; width:300px; margin-left: 20px; vertical-align: top; font-size: 30px; } img.side2{ display:inline-block; } p.side2{ display:inline-block; width: 300px; margin-left: 20px; } maruneko.jpgの横に丸い猫という文章を入れたいのですがどうも上手くいきませんよろしくお願い します。
質問日時: 2022/12/06 05:36 質問者: うるき
ベストアンサー
3
0
-
32
変数宣言と初期値代入の場所について
教えてください。以前も同様の質問させていただいてますが、もう少し突っ込んだ質問をさせてください。 var age; age = 20; という書き方と 宣言と同時に初期化する var age = 20; があった場合ですが、 分けて書く場合に何か微妙に違いが出てくるのでしょうか? 分けて書く場合は、行間にもし数行何か別の実行文があったり、条件分が入っていたりすると違う動きをしてしまうとか、 外から参照されて実行すると違う結果になってしまうなどの恐れがあるので、なるべく初期値を宣言と同時に代入したり、もしくは宣言と初期値代入の行をなるべく続けてにした方がいいのでしょうか? でも初期値は内容によって何を初期値とするかというのがあって条件文の中で初期値代入というのもあるかと思いますが。
質問日時: 2022/10/31 19:09 質問者: ymoshimoshi
解決済
3
0
-
33
ブックマークレットについて
ブックマークレットで以下のようなコードを使っています。 javascript:window.open('https://www.○○○='+ getSelection(). toString()); 選択した文字列を加えて指定したURLに飛ぶブックマークレットです。 ここから質問なんですが、 このコードに現在日時から1ヶ月前をUNIX時間で加えて、指定したURLに飛ぶブックマークレットを作りたいのですが、どのようなメソッド、構文にすればいいかわかりません。 例として、以下のようなURLになるようにしたい ※UNIX時間は現在日時 https://www.○○○1665282832選択した文字列 参考になるWebページもあれば、それも教えていただけると助かります。 よろしくお願いします。
質問日時: 2022/10/09 11:48 質問者: マリーノアール
ベストアンサー
2
0
-
34
ブラウザの横幅に応じてとある画像(e.jpg)を画面いっぱいに表示できるようにしたいです。(写真の横
ブラウザの横幅に応じてとある画像(e.jpg)を画面いっぱいに表示できるようにしたいです。(写真の横幅がブラウザの横幅が変わるごとに変化する) 必ずsetIntervalメソッド等を用いてブラウザの横幅を変えた際にリアルタイムに画像が変更されるようにしたいです。 画像の幅をまず取得して、ブラウザの幅も取得し、 ブラウザの幅が変化するごとに写真の幅も自動的に ブラウザの横幅に合わせるようにしたいのですが分かりません。 詳しい方回答をお願いします。
質問日時: 2022/10/06 21:17 質問者: ウィスク
解決済
1
0
-
35
ローディングアニメーションのロゴがページを読み込んだ後でも消えません
ローディングアニメーションを入れたいと思い、調べて、以下のサイトに辿り着いて、 サイトの一番下から2番目にある、「**跳ねるうさぎちゃん**」とういタイトルのローディングアニメーションのC◆DEOENで動く、HTML,css,jsの全てコピーして、起動してみたのですが、 サイトが読み込めれると、グレー色の背景はちゃんと消えるのですが、その他のロゴ(ウサギや卵、横線)のロゴ等が **消えずに動き続けてしまいます。** このロゴもちゃんと消えるようにしたいです。 多分javascriptの部分だと思うのですが、どう書いたらよいでしょうか? 回答よろしくお願いいたします。 [一生見てられる...カワイすぎるローディングをCSSコピペで実装! 【 アニメーション 】 - デシノン https://deshinon.com/2019/03/03/kawaii-loading-kopipe/ 跳ねるうさぎちゃん
質問日時: 2022/09/20 21:50 質問者: jwmdatjtga
ベストアンサー
1
0
-
36
GASでチェックボックスを一括offしたい
スプレッドシートで添付のようなチェックリストを作りました。 チェックを複数(ランダム)に入れた後、それらのチェック全てを外すGASがわからないので教えてください。 ・GASでなくても可能ですが、あくまでGASにこだわりたい。 ・チェックは自分で入れるので、外すGASだけで良いです。 ・添付左上の水色リセットボタンを押すとチェックが外れるようにしたいです。 ・チェックボックスの間に所々空白があります。 以下は他を参考にして自分で作ってみたGASですが、[▷実行]ができないので多分間違っていると思います。 訂正、加筆して頂いても良いですし、新しく書いて頂いても構いません。 /** @OnlyCurrentDoc */ function uncheck(button) { let spreadsheet = SpreadsheetApp.getActiveSpreadsheet(); let sheet = spreadsheet.getSheetByName('musiclist'); sheet.activate(); let range = sheet.getRange('C3:C29'); range.uncheck(); 中段最後の'musiclist'はシートの名前です。
質問日時: 2022/09/13 19:54 質問者: rocken
ベストアンサー
1
0
-
37
vertical sliderをautoplayしたい
以下を参考に作ったVertical Sliderを読み込み時にautoでスライドできるようにしようとしています。 https://www.learningrobo.com/2022/03/vertical-split-image-slider-using-html.html 現在、参考ページと同様に、クリックすると左右のスライドがそれぞれ上下にスライドします。 これをボタンクリックを残したまま、読み込み時に自動でスライドできるようにしたいと思っています。scriptに2か所追加をいたしましたが、ボタンを押してもスライドせず、読み込み時も 自動でスライドしません。 何か解消方法などアドバイス頂けますと幸いです。 どうぞよろしくお願いいたします。 〇HTML <div class="slider-container"> <div class="left-slide"> <div style="background-color: #2c9f45"> <h4>TEST</h4> </div> <div style="background-color: #c5080b"> <h4>TEST</h4> </div> <div style="background-color: #0386ad"> <h4>TEST</h4> </div> <div style="background-color: #001100"> <h4>TEST</h4> </div> </div> <div class="right-slide"> <div class="bg-image1"></div> <div class="bg-image2"></div> <div class="bg-image3"></div> <div class="bg-image4"></div> </div> </div> 〇JS /*↓↓↓↓追加部分↓↓↓↓↓*/ window.onload = function() { /*↑↑↑↑追加部分↑↑↑↑*/ const sliderContainer = document.querySelector(".slider-container"); const slideRight = document.querySelector(".right-slide"); const slideLeft = document.querySelector(".left-slide"); const upButton = document.querySelector(".up-button"); const downButton = document.querySelector(".down-button"); const slidesLength = slideRight.querySelectorAll("div").length; let activeSlideIndex = 0; slideLeft.style.top = `-${(slidesLength - 1) * 100}vh`; /*↓↓↓↓追加部分↓↓↓↓↓*/ for( ; ; activeSlideIndex++;){ $(slideRight).slideDown("normal"); $(slideLeft).slideUp("normal"); } }; /*↑↑↑↑追加部分↑↑↑↑*/ const changeSlide = (direction) => { const sliderHeight = sliderContainer.clientHeight; if (direction === "up") { activeSlideIndex++; if (activeSlideIndex > slidesLength - 1) activeSlideIndex = 0; } else if (direction === "down") { activeSlideIndex--; if (activeSlideIndex < 0) activeSlideIndex = slidesLength - 1; } slideRight.style.transform = `translateY(-${ activeSlideIndex * sliderHeight }px)`; slideLeft.style.transform = `translateY(${ activeSlideIndex * sliderHeight }px)`; }; upButton.addEventListener("click", () => changeSlide("up")); downButton.addEventListener("click", () => changeSlide("down")); 〇CSS .slider-container { position: relative; overflow: hidden; width: 100%; min-height: 100vh; } .left-slide { height: 100%; width: 35%; position: absolute; top: 0; left: 0; transition: transform 0.5s ease-in-out; } .left-slide>div { height: 100%; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-align: center; padding: 3em; } .left-slide h4 { font-size: 22px; line-height: 32px; color: #fff; font-weight: 100; text-transform: uppercase; } .right-slide { height: 100%; position: absolute; top: 0; right: 0; width: 65%; transition: transform 0.5s ease-in-out; } .right-slide>div { background-repeat: no-repeat; background-size: cover; background-position: center center; height: 100%; width: 100%; }
質問日時: 2022/08/25 14:47 質問者: apricot1101
ベストアンサー
2
0
-
38
functionはhtmlやjsに2度使えませんか
functionはhtmlやjsに2度使えませんか。 要は、同じhtml分や、js内に2度使う、あるいは、複数jsを作って、その全部にfunctionキーを設定できるかと言うことです。 具体的には、 function sample() { //ここに処理を書いていく } function sample2() { //ここに処理を書いていく } といった使い方はできないかということですがどうでしょうか。
質問日時: 2022/08/03 19:55 質問者: 福本英一
ベストアンサー
2
0
-
39
jsで、switch文で書かれた分をif文にできませんか。
jsで、switch文で書かれた分をif文にできませんか。 以下はその文章です。できるなら、全文をお書きください。 <script type="text/javascript" language="javascript"> function onButtonClick() { selindex = document.form1.Select1.selectedIndex; target = document.getElementById("output"); switch (selindex) { case 0: target.innerHTML = "要素1が選択されています。<br/>"; break; case 1: target.innerHTML = "要素2が選択されています。<br/>"; break; case 2: target.innerHTML = "要素3が選択されています。<br/>"; break; case 3: target.innerHTML = "要素4が選択されています。<br/>"; break; case 4: target.innerHTML = "要素5が選択されています。<br/>"; break; } } </script>
質問日時: 2022/07/28 15:10 質問者: 福本英一
解決済
1
0
-
40
jsでifの返り値にgetelementbyidは使えませんよね。
jsでifの返り値にgetelementbyidは使えませんよね。 あきらめるしかないですよね。
質問日時: 2022/07/27 20:24 質問者: 福本英一
ベストアンサー
1
0
-
41
switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。
switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 switch文のswitch(n)の部分を複数の値にできますでしょうか。もし無理ならばif文に変えてほしいです。 以下は変えてほしいjsの文章です。 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript" language="javascript"> function onButtonClick() { selindex = document.form1.Select1.selectedIndex; target = document.getElementById("output"); switch (selindex) { case 0: target.innerHTML = "要素1が選択されています。<br/>"; break; case 1: target.innerHTML = "要素2が選択されています。<br/>"; break; case 2: target.innerHTML = "要素3が選択されています。<br/>"; break; case 3: target.innerHTML = "要素4が選択されています。<br/>"; break; case 4: target.innerHTML = "要素5が選択されています。<br/>"; break; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1""> <option>要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> <input type="button" value="Exec" onclick="onButtonClick();" /> </form> <div id="output"></div> </body> </html>
質問日時: 2022/07/27 17:18 質問者: 福本英一
解決済
1
0
-
42
switch文は、if文みたいに最初の()内に式を2つ以上設定できませんか。
switch文は、if文みたいに最初の()内に式を2つ以上設定できませんか。 caseの部分のことではないです。
質問日時: 2022/07/27 14:07 質問者: 福本英一
解決済
1
0
-
43
セレクトボックスを2つ設けて選択して初めてメッセを表示
セレクトボックスを2つ設けて選択して初めてメッセが出るプログラムを作りたいです。 どのようにすればいいですか。 どのサイトもそのようなサイトは見つかりませんでした。 以下のjsを参考にしたいです。 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript" language="javascript"> function onButtonClick() { selindex = document.form1.Select1.selectedIndex; target = document.getElementById("output"); switch (selindex) { case 0: target.innerHTML = "要素1が選択されています。<br/>"; break; case 1: target.innerHTML = "要素2が選択されています。<br/>"; break; case 2: target.innerHTML = "要素3が選択されています。<br/>"; break; case 3: target.innerHTML = "要素4が選択されています。<br/>"; break; case 4: target.innerHTML = "要素5が選択されています。<br/>"; break; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1""> <option>要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> <input type="button" value="Exec" onclick="onButtonClick();" /> </form> <div id="output"></div> </body> </html>
質問日時: 2022/07/27 12:15 質問者: 福本英一
解決済
1
0
-
44
セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~
セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 次では、セレクトボックスで選択をすれば、メッセージが表示されるようになっています。 <script type="text/javascript" language="javascript"> function onButtonClick() { selindex = document.form1.Select1.selectedIndex; target = document.getElementById("output"); switch (selindex) { case 0: target.innerHTML = "要素1が選択されています。<br/>"; break; case 1: target.innerHTML = "要素2が選択されています。<br/>"; break; case 2: target.innerHTML = "要素3が選択されています。<br/>"; break; case 3: target.innerHTML = "要素4が選択されています。<br/>"; break; case 4: target.innerHTML = "要素5が選択されています。<br/>"; break; } } </script> これと、組み合わせたいのが次のjsの文章です。どうしたらいいですか。 <script type="text/javascript"> function kotae() { ten=0 if((f.q1.value == "松山市"&&f.q2.value == "高松市")||(f.q1.value == "高松市"&&f.q2.value == "松山市")) {f.q1.style.backgroundColor="aqua ";ten = ten + 50} else f.q1.style.backgroundColor="red" if(f.q3.value == "名古屋市"){f.q3.style.backgroundColor="aqua ";ten = ten + 25} else f.q3.style.backgroundColor="red" if(f.q4.value == "金沢市") {f.q4.style.backgroundColor="aqua ";ten = ten + 25} else f.q4.style.backgroundColor="red" f.tokuten.value=ten const keywords = ['あいうえお','かきくけこ', 'さしすせそ']; if (f.tokuten.value=50) { for (let i = 0; i < keywords.length; i++) { console.log(f.rank.value=keywords[0]); }} else if(f.tokuten.value >=20){f.rank.value = 'B'} else if(f.tokuten.value >=15){f.rank.value = 'C'} else if(f.tokuten.value <10){f.rank.value = 'D'} //ここまで } </script> <body> <form name="f"> 愛媛県の県庁所在地は <select name="q1"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。 <p> 香川県の県庁所在地は <select name="q2"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> 愛知県の県庁所在地は <select name="q3"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> 石川県の県庁所在地は <select name="q4"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> <input type="button" name="b1" value="答え合わせ" onclick="kotae()"> <p> <input name=tokuten size="6">点 <!--HTMLここから--> <input name=rank class="hoge">ランク <!--HTMLここまで--> これらを組み合わせて、設問1と設問2でそれぞれ松山市と高松市を選択すればメッセージが表示されるようにしたいです。
質問日時: 2022/07/22 11:10 質問者: 福本英一
解決済
1
0
-
45
コードレビューをお願いします。
javascriptでカメラとマイクの一覧をselectボックスに 表示し ボタンの制御によってカメラのon,offマイクのon,offを 実現させたいのですがマイクのon,offの箇所がうまくいきません 他にもバグがあるかもしれませんが また、カメラとマイクのデバイス一覧をリストに表示できません コードレビューをお願いします <html> <head> <script> function start1(camela_flag, mike_flag) { const video = document.getElementById("video") const audio = document.createElement('audio'); if (camela_flag == 1 && mike_flag == 1) { navigator.mediaDevices.getUserMedia({ video: true, audio: true, }).then(stream => { video.srcObject = stream; video.play(); audio.srcObject = stream; }).catch(e => { console.log(e); }) } else if (camela_flag == 1 && mike_flag == 0) { navigator.mediaDevices.getUserMedia({ video: true, audio: false, }).then(stream => { video.srcObject = stream; video.play(); audio.srcObject = stream; audio.stop(); }).catch(e => { console.log(e) }) } else if (camela_flag == 0 && mike_flag == 1) { navigator.mediaDevices.getUserMedia({ video: false, audio: true, }).then(stream => { video.srcObject = null; video.play(); audio.srcObject = stream; audio.play(); audio.muted = false; }).catch(e => { console.log(e); }) } else { navigator.mediaDevices.getUserMedia({ video: false, audio: false, }).then(stream => { audio.autoplay = false; }).catch(e => { console.log(e) }) } } /* navigator.mediaDevices.ondevicechange = event => { updateDeviceList(); } */ window.onload = function updateDeviceList() { navigator.webkitGetUserMedia({ audio: true, video: true }, function () { navigator.mediaDevices.enumerateDevices().then(function (devices) { devices.forEach(function (device) { alert(device.label); }) }) }, function () { console.log('getUserMedia failed') }) const video = document.getElementById("video") const audio = document.createElement('audio'); navigator.mediaDevices.enumerateDevices() .then(function (devices) { var audiolist = document.getElementById('audiolist'); var videolist = document.getElementById('videolist'); var elem_a = document.createElement("option"); var elem_v = document.createElement("option"); devices.forEach(device => { if (device.kind == 'videoinput') { elem_v.text = device.label; elem_v.value = deviceid; videolist.appendChild(elem_v); } if (device.kind == 'audioinput') { elem_a.text = device.label; elem_a.value = deviceid; audiolist.appendChild(elem_a); } }); }); } </script> </head> <body> <div> <audio id="audio"></audio> <video id="video"></video> <input type="button" onclick="start1(1,1);" / value="カメラ&マイクSTART"> <input type="button" onclick="start1(1,0);" / value="カメラSTART"> <input type="button" onclick="start1(0,1);" / value="マイクSTART"> <input type="button" onclick="start1(0,0);" / value="カメラ&マイクSTOP"> <input type="button" onclick="updateDeviceList();" / value="デバイス変更"> </div> <!--<audio class="gum" title="audio stream from getUserMedia()" controls></audio>--> <label>Select audio output: </label> <style> select { width: 100px; } </style> <select id="audiolist"></select> <select id="videolist"></select> </body> </html>
質問日時: 2022/07/16 05:38 質問者: 39OK
解決済
1
0
-
46
プログラムがうまく動きませんレビューお願いします
<html> <head> <script> function start1(camela_flag, mike_flag) { const video = document.getElementById("video") const audio = document.createElement('audio'); if (camela_flag == 1 && mike_flag == 1) { navigator.mediaDevices.getUserMedia({ video: true, audio: true, }).then(stream => { video.srcObject = stream; video.play(); audio.srcObject = stream; }).catch(e => { console.log(e); }) } else if (camela_flag == 1 && mike_flag == 0) { navigator.mediaDevices.getUserMedia({ video: true, audio: false, }).then(stream => { video.srcObject = stream; video.play(); audio.srcObject = stream; audio.stop(); }).catch(e => { console.log(e) }) } else if (camela_flag == 0 && mike_flag == 1) { navigator.mediaDevices.getUserMedia({ video: false, audio: true, }).then(stream => { video.srcObject = null; video.play(); audio.srcObject = stream; audio.play(); audio.muted = false; }).catch(e => { console.log(e); }) } else { navigator.mediaDevices.getUserMedia({ video: false, audio: false, }).then(stream => { video.srcObject = stream; video.stop(); audio.srcObject = stream; audio.muted = true; audio.volume = 0.0; audio.stop(); }).catch(e => { console.log(e) }) } } navigator.mediaDevices.ondevicechange = event => { updateDeviceList(); } function updateDeviceList() { navigator.mediaDevices.enumerateDevices() .then(function (devices) { elem.innerHTML = "<select>"; elem.innerHTML = "<select>"; devices.forEach(device => { let elem = document.createElement("option"); let [kind, type, direction] = device.kind.match(/(\w+)(input|output)/i); elem.innerHTML += "<option value =" + kind + "> " + direction + "</option>"; if (type === "audio") { audioList.appendChild(elem); } else if (type === "video") { videoList.appendChild(elem); } }); elem.innerHTML += "</select>"; elem.innerHTML += "</select>"; }); } </script> </head> <body> <div> <video id="video"></video> </div> <div> <audio id="audio"></audio> <input type="button" onclick="start1(1,1);" / value="カメラ&マイクSTART"> <input type="button" onclick="start1(1,0);" / value="カメラSTART"> <input type="button" onclick="start1(0,1);" / value="マイクSTART"> <input type="button" onclick="start1(0,0);" / value="カメラ&マイクSTOP"> <input type="button" onclick="updateDeviceList();" / value="デバイス変更"> </div> <div> <audio class="gum" title="audio stream from getUserMedia()" controls></audio> <div class="outputSelector"> <label>Select audio output: </label> <select id = "audio"></select> <select id = "video"></select> </div> </div> </body> </html>
質問日時: 2022/07/10 05:08 質問者: 39OK
解決済
1
0
-
47
以前の質問だと、どの条件でも配列が表示されてしまいます。
<html> <head> <!DOCTYPE html> <meta charset="utf-8"> <script type="text/javascript"> function change(selbox) { var txt1 = document.getElementById("txt1"); var txt2 = document.getElementById("txt2"); switch(selbox.value){ case '松山市': txt1.style.display = ""; txt2.style.display = "none"; break; case '2': txt1.style.display = "none"; txt2.style.display = ""; break; default: } var todo = ['メール確認', '日報送信', 'スケジュール確認', '資料作成']; var str=''; for (var i = 0; i < todo.length; i++) { str += todo[i] + '<BR>'; } document.getElementById('message_area').innerHTML = str; } </script> <body> <form name="f"> 愛媛県の県庁所在地は <select name="q1" onchange="change(this)"> <option value="">選択肢</option> <option value="1">名古屋市</option> <option value="2">松山市</option> <option value="3">金沢市</option> <option value="4">高松市</option> </select> です。 <p> 香川県の県庁所在地は <select name="q2" onchange="change(this)"> <option value="">選択肢</option> <option value="1">名古屋市</option> <option value="2">松山市</option> <option value="3">金沢市</option> <option value="4">高松市</option> </select> です。<p> 愛知県の県庁所在地は <select name="q3"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> 石川県の県庁所在地は <select name="q4"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> テキスト1<input type="text" id="txt1" name="txt1"><BR> テキスト2<input type="text" id="txt2" name="txt2"><BR> <div id="message_area" /> <body> </html> 以上はそのプログラムです。 私は、設問1と設問2でそれぞれ松山市と高松市を選んだら配列を表示できるプログラムを求めています。こんなことはどこのサイトにも書いていません。 いい加減にしてくださいね。
質問日時: 2022/07/09 11:40 質問者: 福本英一
解決済
1
0
-
48
セレクトボックスで配列を呼び出したい。
以下は、セレクトボックス1と2でそれぞれ松山市と高松市を選んだら、配列を呼び出すことができるプログラムです。 <script type="text/javascript"> function change() { if (document.getElementById("selbox")) { selboxValue = document.getElementById("selbox").value; if (selboxValue == "1") { //文字1を表示 document.getElementById("txt1").style.display = ""; //文字2を非表示 document.getElementById("txt2").style.display = "none"; } else if (selboxValue == "2") { //文字2を表示 document.getElementById("txt2").style.display = ""; //文字1を非表示 document.getElementById("txt1").style.display = "none"; } } } function kotae() { ten=0 if((f.q1.value == "松山市"&&f.q2.value == "高松市")||(f.q1.value == "高松市"&&f.q2.value == "松山市")) {f.q1.style.backgroundColor="aqua ";ten = ten + 50} else f.q1.style.backgroundColor="red" if(f.q3.value == "名古屋市"){f.q3.style.backgroundColor="aqua ";ten = ten + 25} else f.q3.style.backgroundColor="red" if(f.q4.value == "金沢市") {f.q4.style.backgroundColor="aqua ";ten = ten + 25} else f.q4.style.backgroundColor="red" f.tokuten.value=ten const keywords = ['あいうえお','かきくけこ', 'さしすせそ']; if (f.tokuten.value=50) { for (let i = 0; i < keywords.length; i++) { console.log(f.rank.value=keywords[0]); }} else if(f.tokuten.value >=20){f.rank.value = 'B'} else if(f.tokuten.value >=15){f.rank.value = 'C'} else if(f.tokuten.value <10){f.rank.value = 'D'} //ここまで } </script> <body> <form name="f"> 愛媛県の県庁所在地は <select name="q1"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。 <p> 香川県の県庁所在地は <select name="q2"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> 愛知県の県庁所在地は <select name="q3"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> 石川県の県庁所在地は <select name="q4"> <option>選択肢</option> <option>名古屋市</option> <option>松山市</option> <option>金沢市</option> <option>高松市</option> </select> です。<p> <input type="button" name="b1" value="答え合わせ" onclick="kotae()"> <p> <input name=tokuten size="6">点 <!--HTMLここから--> <input name=rank class="hoge">ランク <!--HTMLここまで--> しかし、僕はもうちょっと踏み込んだところまで行きたいのです。 ブラウザに表示させたいのです。 document.writeで書くと別のページに遷移してしまうし、 一方でalertだと文章が読みづらいです。 ブラウザに配列を表示するものは以下のプログラムですが、 <script> var todo = ['メール確認', '日報送信', 'スケジュール確認', '資料作成']; for (var i = 0; i < todo.length; i++) { var todoList = document.createElement('li'); todoList.textContent = todo[i]; document.getElementById('list').appendChild(todoList); } </script> ただ、これだとセレクトボックスで松山市と高松市を選んだ場合の表示ができません。どうしたらいいのでしょうか。 どうしたらいいのでしょうか。
質問日時: 2022/07/08 20:14 質問者: 福本英一
解決済
1
0
-
49
console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします
2022のみconsole.logに表示されて2021が表示されません。 let result = JSON.stringify(allobj); にしてJSON.stringifyをまとめても、console.log(JSON.stringify(objA));console.log(JSON.stringify(objB));と分けてもダメでした。 打てる手はすべてやったと思っているのですが、どうすればいいんでしょうか… <div class="selectbox"> <select name="top"> <option value="">年を選択</option> <option value="op-a">2021</option> <option value="op-b">2022</option> </select> <select name="op-a"> <option value="">2021グループから選択</option> <option value="op-a-1">1</option> <option value="op-a-2">2</option> <option value="op-a-3">3</option> <option value="op-a-4">4</option> <option value="op-a-5">5</option> <option value="op-a-6">6</option> <option value="op-a-7">7</option> <option value="op-a-8">8</option> <option value="op-a-9">9</option> <option value="op-a-10">10</option> <option value="op-a-11">11</option> <option value="op-a-12">12</option> </select> <select name="op-b"> <option value="">2022グループから選択</option> <option value="op-a-1-1">1</option> <option value="op-a-1-2">2</option> <option value="op-a-1-3">3</option> <option value="op-a-1-4">4</option> <option value="op-a-1-5">5</option> <option value="op-a-1-6">6</option> <option value="op-a-1-7">7</option> <option value="op-a-1-8">8</option> <option value="op-a-1-9">9</option> <option value="op-a-1-10">10</option> <option value="op-a-1-11">11</option> <option value="op-a-1-12">12</option> </select> <button type="button" id="selectbox-reset">リセット</button> <style> .selectbox select:not(select[name=top]) { display:none; } </style> <script> window.addEventListener('load', function () { //onchangeイベントの設定 document.querySelectorAll('.selectbox select').forEach(elm => { elm.onchange = function () { let elm2 = document.getElementsByName(this.value)[0]; if (elm2) { elm.style.display = 'none'; elm2.style.display = 'block'; } } }); //リセットボタン document.getElementById('selectbox-reset').onclick = function () { document.querySelectorAll('.selectbox select').forEach(elm => { if (elm.name == 'top') { elm.style.display = 'block'; } else { elm.style.display = 'none'; } elm.selectedIndex = 0; }); }; }); //オブジェクトを定義するvarは受け取る際にエラーが起きそう再宣言のできるletを選択 let objA = { // プロパティを定義 // キー: 値 year: "2021", month: "1,2,3,4,5,6,7,8,9,10,11,12", }; let objB = { // プロパティを定義 // キー: 値 year: "2022", month: "1,2,3,4,5,6,7,8,9,10,11,12", }; //オブジェクトをまとめる let allobj = Object.assign(objA, objB); //JSON.stringifyとは、JavaScriptのオブジェクトや値などのデータをJSONに変換するための関数 let result = JSON.stringify(objA,objB); //変数「result」に代入 console.log(result); </script>
質問日時: 2022/07/07 22:13 質問者: 初心者サイト作成
ベストアンサー
2
0
-
50
GoogleChart 階層ごとのブロックの長さを個別に設定したい
GoogleChart 階層ごとのブロックの長さが、最も長いものにすべて統一されてしまうため それぞれの長さで個別に設定することは可能でしょうか? 構造上、不可能な気もしますが、、、 どうかお知恵をお貸しください。よろしくお願いいたします。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script> google.charts.load('current', {packages:["orgchart"]}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Name'); data.addColumn('string', 'Manager'); data.addColumn('string', 'ToolTip'); // For each orgchart box, provide the name, manager, and tooltip to show. data.addRows([ [{'v':'test1', 'f':'test1'}, '', 'The President'], [{'v':'test2', 'f':'test2<div style="color:red; font-style:italic">一番長い<br>ブロックで<br>全ての列が<br>統一されてしまう</div>'}, 'test1', 'VP'], ['test3', 'test1', ''], ['test4', 'test1', 'Bob Sponge'], ['test5', 'test2', ''] ]); // Create the chart. var chart = new google.visualization.OrgChart(document.getElementById('chart_div')); // Draw the chart, setting the allowHtml option to true for the tooltips. chart.draw(data, {'allowHtml':true}); } </script> </head> <body> <!-- グラフの描画エリア --> <div id="chart_div"></div></body> </html>
質問日時: 2022/07/06 14:27 質問者: DDddDDdd11221122
ベストアンサー
1
0
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
最新のコラム/記事
-
マッチングアプリで出会ったカップルは成婚率が高い!?結婚カウンセラーに聞いてみた
パートナーとの出会いの場として、もはや主流となったネット婚活やマッチングアプリ。中でも手軽に登録できるマッチングアプリは、10代から50代と幅広い年代が利用している。一方で、“相手の目的が投資関係の詐欺や...
-
メダロット:第250話「Vol.250※期間限定公開」
天才メダロッター六葉カガミの戦いを描く「メダロット再~リローデッド~」(漫画:伯林、監修:イマジニア)、20周年を迎えた『メダロット』が新たなストリーでココに再起動!!★全話無料で読める、週刊メダロット通信...
-
メダロット:第249話「Vol.249※期間限定公開」
天才メダロッター六葉カガミの戦いを描く「メダロット再~リローデッド~」(漫画:伯林、監修:イマジニア)、20周年を迎えた『メダロット』が新たなストリーでココに再起動!!★全話無料で読める、週刊メダロット通信...
-
日本古来の伝統工芸「金継ぎ」で修復した食器は前と同じように使えるの?
大切にしている食器が割れてしまったら、きっと誰もが「元に戻したい」と願うだろう。「教えて!goo」にも「割ってしまったお気に入りの食器を復活できる?」という質問があり、最適な方法について様々な意見が寄せら...
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
<div>のタッチ状態を維持したままラ...
-
フォームが空欄の時にフォームの外...
-
プラグイン無しでContactform7にdat...
-
変数名をどのようにつけるのが良い...
-
階層別の組織図の自動作成について
-
条件に該当した時のみ定数を宣言す...
-
2段階プルダウンで1段階目の選択を...
-
読み込んだQRコードをフォームに受...
-
初心者です。gulpでコンパイルがで...
-
正規表現について質問です。条件に...
-
jQueryでシンセサイザーを作ってい...
-
メールフォームの日付入力フォーム...
-
二次元配列を使って順位をだすとき...
-
二次元配列の中の各行の要素をラン...
-
出発駅A、到着駅Bを選択すると、2.3...
-
スマホ上で、左右スワイプで次のペ...
-
【Google Apps Script】「ライブラ...
-
jQueryで同じクラス名のものを別物...
-
①入力フォーム→②確認表示画面→③送信...
-
プログラムについて。
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
スマホ上で、左右スワイプで次のペ...
-
読み込んだQRコードをフォームに受...
-
追加ボタンを押した際に ok ボタン...
-
①入力フォーム→②確認表示画面→③送信...
-
階層別の組織図の自動作成について
-
セレクトボックスで配列を呼び出し...
-
jsonテキストデータの並び替えがで...
-
【Google Apps Script】「ライブラ...
-
二次元配列を使って順位をだすとき...
-
初心者です。gulpでコンパイルがで...
-
jQueryで同じクラス名のものを別物...
-
HTMLでサブフレームから親のスクリ...
-
Colorboxがうまく設置できません
-
セレクトを全て選択されていないと...
-
画面遷移を行わずに同一ページでHTM...
-
フォームが空欄の時にフォームの外...
-
Googleフォームで選択肢に応じて次...
-
【GAS】WEBアプリでハイパーリンク...
-
jsで質問です。 ボタンが二つ存在し...
-
GASでチェックボックスを一括offしたい
おすすめ情報