JavaScript(7ページ目)

JavaScriptはWebページにアニメーションや効果を加えることができるプログラミング言語です。入門編のわかりやすいサイトや書籍を紹介してほしい、オブジェクト指向がわからない、文字列の操作を教えてほしい等こちらに投稿してみましょう。

回答数

気になる

javascript スライダーについて

https://code-kitchen.dev/html/input-range/ 前回の質問の続きになってしまうのですが、上のサイトを参考に -----html----- <input type="range" id="example" min="1" max="5" step="1"> <p>2つのペアの画像は相性が<span id="current-value"></span>です。</p> ----javascript----- window.onload = () => { const inputElem = document.getElementById('example'), currentValueElem = document.getElementById('current-value'), setCurrentValue = (val) => {currentValueElem.innerText = val;}, rangeOnChange = (e) =>{setCurrentValue(e.target.value);}; inputElem.addEventListener('input', rangeOnChange); setCurrentValue(inputElem.value); } となった時にhtmlの<span id="current-value"></span>の部分を数字ではなく言葉を入れたいときはjavascriptでvalをいじればいいのでしょか？自分で試したのはletで新しい変数aisyoを作って、ｊｓの5行目のvalを新しい変数aisyoに変えて if文でvalの数がこれならaisyoはこの文字列を代入するってやったんですが動かなかったです

質問日時: 2021/10/19 15:35 質問者: わちょん

ベストアンサー

1

0
Backbone.js イベントが効かない

"click li" : "_onClick" のイベントが動作しません。分かる人いましたら、教えてください。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://code.jquery.com/jquery-2.2.2.js" integrity="sha256-4/zUCqiq0kqxhZIyp4G0Gk+AOtCJsY1TA00k5ClsZYE=" crossorigin="anonymous"> </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.2/backbone.js"></script> </head> <body> <script type="text/template" id="user-template"> <%- name %> <%- age %> 才 </script> <script> const Person = Backbone.Model.extend({}); const Users = Backbone.Collection.extend({ model: Person }); const users = new Users(); //データ追加 users.add({ name: "太郎", age: 8 }); // 要素の作成 const span_view = Backbone.View.extend({ tagName: "li", template: _.template($("#user-template").html()), events : { "click li" : "_onClick" }, _onClick: function() { console.log('detected'); }, render: function() { const tpl = this.collection.map( v => this.template(v.attributes) ).join('<br>'); this.$el.html(tpl); return this; } }); const span = new span_view({ collection: users }); // 要素を画面に描画 $("body").html(span.render().el); </script> </body> </html>

質問日時: 2021/10/19 13:14 質問者: i-d-a-i

ベストアンサー

1

0
javascript スライダー

https://code-kitchen.dev/html/input-range/ このページに書いてあるサンプルコードの完成形と同じことをやってもhtmlの<span id="current-value"></span>ここに入るはずの数字が表れませんどのスライダーを選んでも”現在の値はです”と表示されます分かる方教えてください

質問日時: 2021/10/19 05:29 質問者: わちょん

ベストアンサー

2

0
Javascript でログインできないページ

こんばんは下記サイトなのですが、javascriptでユーザーIDとパスワードを入力しても、エラーで弾かれてしまうのですが、なぜなのでしょうか？ https://ds.digitalpharmacy.jp/login document.querySelectorAll("input")[0].value = "hoge"; document.querySelectorAll("input")[1].value = "huga"; document.querySelectorAll("button")[1].click();

質問日時: 2021/10/16 20:13 質問者: Hypnomatic

解決済

2

0
ｊｓぽっぷあっぷ?

おそらくｊｓの技術だと思います。１，ポップアップというのでしょうか？ 2，棚に入れるというボタンをクリックしたらそのうえ？に「見終わった」「見たい」などのボタンが表示されます。下記の画像ようなプログラムはどうすれば作れますか？

質問日時: 2021/10/16 17:17 質問者: 9うい9p

ベストアンサー

3

1
ajax で読み込みを途中で止めたり、途中から開始したい。

ajax で読み込みを途中で止めたり、途中から開始したい。そういうことはできるのでしょうか ? サンプルになるページは見つかりませんでした。ソースもしくは、参考になるページを知りませんか ? よろしくお願いします ! <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1">  <script src="https://code.jquery.com/jquery-2.2.2.js" integrity="sha256-4/zUCqiq0kqxhZIyp4G0Gk+AOtCJsY1TA00k5ClsZYE=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.2/backbone.js"></script> </head> <body> <script> const PostModel = Backbone.Model.extend({ url: 'http://jsonplaceholder.typicode.com/posts/1' }) new PostModel() .fetch() // 取得 .done(function(post) { console.log(JSON.stringify(post)); }) //.done((post) => console.log(JSON.stringify(post))); /* function () {} アロー関数 function を取る。中括弧をアローにする。アローの先に中身を書く () => 中身。 */ </script> </body> </html>

質問日時: 2021/10/15 22:37 質問者: i-d-a-i

ベストアンサー

2

0
javascript教えてください

const rows = []; function go_forward() { const row = [ pics_src[num],　　　　　　　　　//リンゴの画像 document.formname.a001.value,//赤い document.formname.a002.value,//おいしそう document.formname.a003.value,//フルーツ document.formname.a004.value,//丸い document.formname.a005.value, ].join(','); rows.push(row); document.formname.a001.value = '';//空白に戻す document.formname.a002.value = ''; document.formname.a003.value = ''; document.formname.a004.value = ''; document.formname.a005.value = ''; } htmlで5つフォームを作ってフォームの内容と写真の名前を go_forward(ボタン)を押すとcsvに保存してフォーム内容を空白にするコードがあるのですが jsで上記を書いても動かないですこれはhtmlの内容が悪いのか、上のコードが物足りないのかわからないです

質問日時: 2021/10/14 20:54 質問者: わちょん

ベストアンサー

2

0
htmlとjavascriptの違い

htmlのscriptタグの内容とjavascriptの内容は何が違うのですが？どちらもfunctionなどを入れれば中身を動かせそうですが

質問日時: 2021/10/14 20:41 質問者: わちょん

ベストアンサー

3

0
csvに保存しているデータをURLにする方法

フォームに書いた内容をcsvに保存するところまでは行けたのですが、それをblobにしてダウンロードURLを作るやり方がわからないです

質問日時: 2021/10/14 19:28 質問者: わちょん

ベストアンサー

3

0
Googleクロム開発ツール JavaScriptについて

プログラミング初心者です。現在、Googleクロムの開発ツールを使用して、JavaScriptで組む練習をしています。そんな中、写真データがブラウザへ反映させる方法がわからず、困っています。参考として、エラー画面を添付いたします。すみませんが、どなたかご教示いただけると助かります。宜しくお願いいたします。

質問日時: 2021/10/13 20:54 質問者: はんばーぐ1219

ベストアンサー

2

0
JavaScript プログラミング言語について

プログラミング言語学習の初心者です。現在、JavaScriptの開発ツールにgoogleクロムのものを使用しております。言語で大文字と小文字が誤っているとエラー表示が出ます。そもそも大文字と小文字は、なぜ区別する必要があるのでしょうか？本当に初歩的な質問で申し訳ありませんが、どなたか教えてください。ちなみにエラー表示が出た言語は以下の言語となります。 getelementbyid('nextbtn');

質問日時: 2021/10/11 23:04 質問者: はんばーぐ1219

ベストアンサー

1

0
ブログのボタン

jsなどで添付画像のようなブログでよくある「ボタンをクリックするとhtmlタグが挿入される」物を作りたいのですが、どのように作ればよいか＆検索ワードがわかりません。教えていただけませんか？例えば、 if(イタリックが選択されれば) ｛要素の作成｝ else if(もう一度押されれば) ｛上記の終了タグを追加｝みたいな感じでしょうか？

質問日時: 2021/10/09 08:50 質問者: 9うい9p

ベストアンサー

2

0
webデザインの勉強をしているのですが、お問い合わせフォームにjquery validation P

webデザインの勉強をしているのですが、お問い合わせフォームにjquery validation Pluginを使ってエラーメッセージを表示させようとしたら、わざと文章を何も入れないで送信ボタンをメッセージは出るのですが、そこからまた送信ボタンを押したり一度枠の中をクリックしてから外側を押すと更にその上に新しいエラーメッセージが出てきてメッセージがたくさんになってしまいます。何か間違えているのでしょうか？以下script部分です。 <script src="jquery.validate.min.js"></script> <script> $(function(){ $("#form").validate({ // 入力のルール rules: { // 必須項目 "name_sei": { required: true }, "name_mei" : { required: true }, "email" : { required: true }, "message" : { required: true }, }, // エラーメッセージ messages:{ "name_sei" : { required : "<span class='warning'>・お名前(姓)の入力を行ってください。</span><br>" }, "name_mei" : { required : "<span class='warning'>・お名前(名)の入力を行ってください。</span><br>" }, "email" : { required: "<span class='warning'>・メールアドレスの入力を行ってください。</span><br>" }, "message" : { required: "<span class='warning'>・お問い合わせ内容の入力を行ってください。</span><br> errorPlacement: function(error, element){ error.insertBefore("#form"); } }); }); </script>

質問日時: 2021/10/06 23:45 質問者: reo96319

ベストアンサー

1

0
ＪＳについて

jsで要素のアニメーションの制作をしました。１、cssが left: calc(100% - 100px);ではないと動かなくなるのはなぜでしょうか？ ※right:0;とかでは動かなくなる。 2，ボタンの onclick="clickTest()ではなくjsにdocument.getElementById("").onclick = function() { と書いたら動かなくなるのはなぜですか？以下コード <style> #anime_test{ height: 100px; width: 100px; background-color: #F44336; position: relative; left: 0; transition: 3s; } #anime_test.act { background-color: #2196F3; left: calc(100% - 100px); } #anime_test-btn { margin-top: 10px; display: inline-block; padding: 5px 10px; border: solid 1px; cursor: pointer; } </style> <body> <div id="anime_test"> </div> <div id="anime_test-btn" onclick="clickTest();"> ボタン </div> <script> document.getElementById("anime_test-btn").onclick = function() { function clickTest() { target = document.getElementById("anime_test"); if (target.className == null || target.className=="") { target.className = "act"; } else { target.className = ""; }} }; </script> 本来のコードでは document.getElementById("button").onclick = function() { はないもので動いていました。

質問日時: 2021/10/06 09:38 質問者: 9うい9p

ベストアンサー

2

1
JavaScriptの将来性

JavaScriptは将来性が高い言語ですか？JavaScriptを勉強するならTypeScriptも一緒に勉強した方がいいですか？

質問日時: 2021/10/06 08:53 質問者: オバケイ

解決済

2

0
dartについて

dartってjsのような働きを期待されていましたが、 https://www.publickey1.jp/blog/15/chromedartvmdart.html みたいな記事がありました。これってクロームではコンパイルするけど他のブラウザは動くかどうかわからないということなのですか？

質問日時: 2021/10/05 17:02 質問者: 9うい9p

ベストアンサー

1

1
formを書き換えて送信する方法

<form method="post" id="addToCart" action="/gp/product/handle-buy-box/ref=dp_start-bbf_1_glance" class="a-content"> <input id="add-to-cart-button" name="submit.add-to-cart" title="カートに入れる" data-hover="ショッピングカートに追加" class="a-button-input" type="submit" value="カートに入れる" aria-labelledby="submit.add-to-cart-announce"> </form> 上記のようなフォームのあるwebページが有るのですが、このソースのinput nameの部分をデベロッパーツールにて一部書き換えて上記ボタンをクリックすると望んだ挙動を得られるんですが上記inputのボタンをクリックしたときの挙動をさせるためのURL、もしくはjavascript文は作れますでしょうか？

質問日時: 2021/09/29 04:08 質問者: mania11

ベストアンサー

1

0
Javascript アロー関数について

// function function test(x) { return x + 1; } // arrow function 引数なし (かっこがいる) const test = () => 1; // 出力の式が一行の場合はreturnは不要 // arrow function 引数1つ (かっこいらない) const test = x => x + 1; // arrow function 引数2つ以上 (かっこいる) const test = (x, y) => x + y + 1; 2 つ質問があります。 1 つは書き方を覚えにくい、覚えやすい方法はないのですか ? 2 つ目以下です。アロー関数 1. this を持ちません。 2. arguments を持ちません。 3. new で呼び出すことはできません。 4. (super も持っていません。が、私たちはまだそれを学んでいませんでした。チャプタークラスの継承で学習しましょう)。これは、独自の “コンテキスト” を持たず、むしろ現在のコンテキストで動作するコードの小さい部品を意味するためです。そして、そのようなユースケースで本当に輝きます。普通にこれまでの関数を使えば良いと思うのですが上記 2 の意味がわかりませんが、上記以外の状況で、短く書きたい時に使うのがアロー関数ですか ?

質問日時: 2021/09/26 13:17 質問者: i-d-a-i

ベストアンサー

2

0
同期関数とawaitの違い

nodeを使用していますが、用意されている様々な関数(libruary)に、同期型（例 readFileSync)と、非同期関数をawaitを使って実行完了を待つ方法とでは、プログラム製作上での違いは何でしょうか？どちらでも選べる場合、使い分けた方が良い場合があるのでしょうか？

質問日時: 2021/09/26 09:06 質問者: yukimesan

解決済

2

0
backbone.js テンプレートの表示方法教えて !

backbone.js テンプレートの表示方法教えて ! 分かる方よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://code.jquery.com/jquery-2.2.2.js" integrity="sha256-4/ zUCqiq0kqxhZIyp4G0Gk+AOtCJsY1TA00k5ClsZYE=" crossorigin="anonymous"> </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ underscore.js/1.8.3/underscore.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ backbone.js/1.3.2/backbone.js"></script> </head> <body> <script type="text/template" id="user-template"> エリア <%- area %> <%- name %> <%- age %> 才 </script> <script> const Person = Backbone.Model.extend({ defaults: { area: "東京都" } }); const Users = Backbone.Collection.extend({ model: Person }); const users = new Users(); //データ追加 users.add({ name: "次郎", age: 28 }); users.add({ name: "花子", age: 25 }); // 要素の作成 const span_view = Backbone.View.extend({ tagName: "span", template: _.template($("#user-template").html()), render: function() { // コレクションのデータをテンプレートに反映 const tpl = this.template(this.model.toJSON()); this.$el.html(tpl); return this; } }); const span = new span_view({ collection: users }); // 要素を画面に描画 $("body").html(span.render().el); </script> </body> </html>

質問日時: 2021/09/25 19:43 質問者: i-d-a-i

ベストアンサー

1

0
今更 jQuery ですが、(function($){ の書き方ってわかりますか ?

(function ($) { var func=function(){ }; var a=1; })(window.jQuery); などと書いても、func 及び a は外部と衝突を起こさない。スコープ的なものを意識しての書き方だと思いますが、 })(window.jQuery); ここの部分は })(jQuery); こういうのも見ます。上記と同じでしょうか ? })(XXXXX); XXXXXの引数に全然違う名前を書くというのは無しですよね ?

質問日時: 2021/09/25 07:44 質問者: i-d-a-i

ベストアンサー

2

0
【ipad】スペースキーが実行できない。

ブラウザでのタイピングゲームを開発しています。（委託）スペースキー実行でタイピングゲームがスタートするのですが、 ipad（キーボード付き）で実行すると無反応です。委託元も原因究明中ですが、私もできることがないかとこちらで質問させてただきました。使用している言語は・HTML　CSS ・Javascript ・PHP です。・ブラウザは関係ないみたいです。・３台中３台とも同じ挙動で無反応。・ＰＣでは問題なく動く。・他のタイピングサイトは動いている。【他のタイピングサイト参考】 https://www.e-typing.ne.jp/roma/variety/business.asp 他のサイトは問題なく動くことを考えると、デバイスの設定は関係ないように思います。もし分かる方がいらっしゃいましたら助けていただきたいです。よろしくお願いいたします。

質問日時: 2021/09/24 16:05 質問者: 小さな木

解決済

1

0
Javascriptで現在時刻を設定して出力しましたが。。

/* 時間 */ mydate=new Date(); Ye=mydate.getFullYear()+"."; Mo=mydate.getMonth()+1+"."; Da=mydate.getDate()+"."; Day=mydate.getDay(); Day2=new Array(7); Day2[0]="日";Day2[1]="月";Day2[2]="火"; Day2[3]="水";Day2[4]="木";Day2[5]="金"; Day2[6]="土"; document.write(Ye+Mo+Da+"（"+Day2[Day]+"）"); こちらのJSなのですが Day2（曜日）の部分の文字色と背景を設定し、四方に丸みをつけたいのですがどうすればよろしいですか？ご存じの方お願いいたします。

質問日時: 2021/09/22 20:07 質問者: お尻ぷりぷり

解決済

3

0
Javascript の !! は何を意味している ?

関数で以下のリターンを見ました。!! はどういう意味ですか ? return !!this.get('completed');

質問日時: 2021/09/19 14:30 質問者: i-d-a-i

ベストアンサー

1

0
javascriptで、style undefined と出てエラーになる

お世話になります。JS初心者です。 jsで、「要素を追加し、ある文字が無いときは非表示にする」ということをしたいのですが、コンソールでは何のエラーは出ませんが、動作しません。ちなみに、 functionを取ったり、16行目の下(let htmlstrApper〜)に htmlstr.style.display = "none"; を入れると、 style undefined　でエラーになります。一体どこが悪いのでしょうか？どなたか、ご教授のほど、どうぞ宜しくお願い致します。 <html> <body> <div> <div class="itemDescription"> <p>テストです。テストです。</p> <div class="buttonA"> <button type="submit" style="display: block;">ボタン</button> </div> </div> </div> <script> function htmlstrCkbtnApper(){ let itemDescription = document.querySelector(".itemDescription").innerText; let buttonA = document.querySelector(".buttonA"); const htmlstr = '<p style="color:red;font-weight:bold">追加の説明文あああ</p>'; let htmlstrApper = buttonA.insertAdjacentHTML('beforebegin',htmlstr); if(itemDescription.match(/いいい/) ) { htmlstr.style.display = "block"; }else{ htmlstr.style.display = "none"; } } </script> </html>

質問日時: 2021/09/18 23:23 質問者: kotamagokotama

ベストアンサー

2

0
JavaScriptで計算問題のページを作成したい

LBJ236と申します。現在、計算問題のページを作成しているのですが、form内に入力した解答とランダムな6つの数値の合計との比較（合っているのか）が出来なく、手詰まりになってしまっています。私なりにソースコードを書いたので見て頂けると幸いです。 <body> <p class = "main_p1"> <span id="t1">0</span>+<span id="t2">0</span>+ <span id="t3">0</span>+<span id="t4">0</span>+ <span id="t5">0</span>+<span id="t6">0</span>= </p> <p class = "main_p2"><input id="b1" type="button" value="start" onclick="cb1()"> <input id="input"> <span id="message"> <script> input.addEventListener('keydown', (e) => { if(e.key === 'Enter') { document.getElementById("t1").textContent=(Random(1, 9)); document.getElementById("t2").textContent=(Random(1, 9)); document.getElementById("t3").textContent=(Random(1, 9)); document.getElementById("t4").textContent=(Random(1, 9)); document.getElementById("t5").textContent=(Random(1, 9)); document.getElementById("t6").textContent=(Random(1, 9)); //var input = document.getElementById("input").value; //var a = parseInt(input, 10); //var result = document.getElementById("result"); //result.value = a; input.value = ""; } }) </script> </body> よろしければ上記の内容で製作する方法を教えていただけませんでしょうか？よろしくお願いします。

質問日時: 2021/09/18 18:44 質問者: LBJ236

ベストアンサー

1

0
jQueryクックブックレシピ5.11 テーブルをすばやく読み込むサンプルコードが動かない

jQuery入門にはかなり高度な本を選んでしまいました。レシピを1個1個実行しながら、レシピ5.11まで来たのですが、レシピ5.11のコードが動きません。 =========以下抜粋========= JSONデータのフォーマットは次のとおり。 { "names": [ { "first": "Azzie", "last": "Zalenski", "street": "9554 Niemann Crest", "city": "Quinteros Divide", "state": "VA", "zip": "48786" }, // このフォーマットのデータが1,000個ある ] } JavaScriptコードは次のとおり。 // HTML用に&、<、>がエスケープされたテキストを返す function esc( text ) { return text .replace( '&', '&' ) .replace( '<', '<' ) .replace( '>', '>' ); } $(document).ready( function() { function fillTable( names ) { $.each( names, function() { $('<tr>') .append( $('<td>').addClass('name').html( esc(this.first) + ' ' + esc(this.last) ) ) .append( $('<td>').addClass('address').html( esc(this.street) + '<br />' + esc(this.city) + ', ' + esc(this.state) + ' ' + esc(this.zip) ) ) .appendTo('#nameTable'); }); } $.getJSON( 'names/names-1000.json', function( json ) { fillTable( json.names ); }); }); そして、ドキュメントには次のHTMLコードが含まれている。 <table id="nameTable"> </table> =========以上抜粋========= JSONデータというものは実際に1000個作らずにサンプルと全く同じ(コメント含む)ものを用意しました。 jQueryモジュールは1章で学習したようにファイルの先頭で、 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> と記述して読み込んでいます。本によると、これで1000件の住所録が表示されるはずなのですが、しかしchromeでは何も表示されませんし、エラーメッセージも何も表示されません。これを正しく動かすために修正すべき個所を提示していただきたく、質問に参りました。

質問日時: 2021/09/18 16:04 質問者: zyousuke

ベストアンサー

2

0
【Javascript】Objectで埋め込んだhtmlとの連動

Javascript初心者です。可否を含めご教示いただけましたら幸いです。画像のように、[A]の <div>内のチェックボックスの結果を、 [B]の<object>で埋め込んだhtmlに、チェックボックスの結果を連動させる事は可能でしょうか。可能な場合は、どの様な方法が考えられますでしょうか。どうぞよろしくお願いいたします。

質問日時: 2021/09/16 10:23 質問者: JackJohnson

解決済

1

0
JavaScript 要素を取得・比較して、一致した要素のタグを非表示にしたい

下記のようなhttps://www.test.co.jp/hoge/b.htmlというページ内に同ページへのリンクが入っていたら、そのリンクが記載されている要素を非表示にするJSの記述方法をご教授いただきたいです。 JavaScriptについては初心者で多少読める程度のレベルです。・現在のページのパスを取得・該当のリンク要素を取得このあたりまではわかるのですが、この要素同士を比較して要素が合致したら該当箇所を非表示させるという方法がわからなくて行き詰っている状況です。〇実現したいこと現ページのURLとページ内のリンク（URL）が合致したら、そのリンクが貼ってある要素を非表示にさせる JavaScript ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー const path = document.location.pathname.split("/").pop(""); const link = document.querySelectorAll(".hogehoge")>li>a); ↑こちらの記述ももし間違っているようでしたらご指摘いただけると助かります。 /hoge/b.html ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <blockquote> <ul> <li class="hogehoge"><a href="/hoge/a.html">テキストリンクA</a></li> <li class="hogehoge"><a href="/hoge/b.html">テキストリンクB</a></li>　← このliタグを非表示にしたい <li class="hogehoge"><a href="/hoge/c.html">テキストリンクC</a></li> <li class="hogehoge"><a href="/hoge/d.html">テキストリンクD</a></li> <li class="hogehoge"><a href="/hoge/e.html">テキストリンクE</a></li> </ul> </blockquote> </body> </html> ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

質問日時: 2021/09/14 13:40 質問者: UT-1049

解決済

1

0
WEBページのジャンプ。素早く行うにはどうする？

概要あるWEBページ（ページAとします）にアクセスした瞬間に別のページ（ページBとします）にジャンプさせたくて、META、Javascriptなどを使ってみました。しかしどうしても最初のページAが画面上に見えてしまいます。瞬時にジャンプさせるにはどうしたらいいでしょうか？詳細ページAにアクセスしたときに、瞬時にページBにジャンプさせたくて、 WEBサイトで情報を得て、以下の2種類をページAに記載してみました 3秒後にジャンプする手法　META方式 <META http-equiv="Refresh" content="3;URL=jump.html"> 3秒後にジャンプする手法　Javascript方式 <BODY onLoad=setTimeout("location.href='jump.html'",3000)> 上記の2種の方法は「3秒後にジャンプ」なので、秒数の引数を 0秒に変更してみました。しかし、どちらの手法を用いても一秒ほど、最初にアクセスするページAが表示されたのちにページBが表示されます。出来うることならば（いや、絶対に）ページAにアクセスした瞬間にページBが表示され、操作者に「あ、今、ページAにアクセスしてから自動的にページBに飛んだな」ということを察知してほしくありません。どうしたらページAにアクセスした瞬間にページBが表示されるでしょうか？ <細かい話をします> こういう質問をすると、そもそもの「ページAアクセス時に瞬時にページBにジャンプする方法」に回答せずに、「なぜAからBにジャンプさせねばならんの？　だったら最初からページBのURLを提示して ”ページBにアクセスしてください” というようにWEB閲覧者にお願いすればいいじゃないの？それを、Aにアクセスしたと見せかけて、Bにアクセスさせる、というのは何か悪意が感じられなあ！　質問の背景が怪しいですね！！！！！」などとカラんでくる方がいらっしゃいます。まあ、別にこちらは悪いことをしているわけでもなければ、WEB閲覧者をだまそうとしているわけでもないのでお答えします。ページAは自分（質問者）が用意したサイト内のページです。そしてページBは外部のWEBサービスを使って作ったページです。最初から外部のページBのURLを提示してもいいのです。しかし、そのページのアクセス解析（アクセス日時、IPアドレス、回数など）をしたいのです。多分、回答されるご貴兄は「じゃあ、ページBのアクセス解析をすりゃあいいじゃんか！　なんでジャンプなんかさせるんだ？　おかしいじゃないか！」と思われることでしょう。ところがページBは外部のWEBサービスですので、アクセス解析タグが置けません。そこで、自分の作ったサイト内のページAにアクセス解析タグを置いて、ページAを経由させて自動的にページBに進ませることでアクセス解析を可能にしたい、ということです。こういうと多分回答されるご貴兄は「外部のWEBサービスだってやりようによってはアクセス解析できるよ　わざわざジャンプなんかさせなくてもいいんだよ！」とおっしゃるかもしれません。しかし、自分の作ったサイトで使っているアクセス解析になれているので、その方法でアクセス解析をしたいのです。というわけで、ページAのURLをクリックしたあと、ページAは表示されずに、瞬時にページBを表示させたいです。妥協できる点があるとすれば以下のやり方かな？　と思います。１　ページAにアクセスした後にページBにジャンプするさい、「ページAを経由している」ということを察知されたくないので、ページAの画像は極力（いや、絶対に）表示したくないそのためならばページAのURLクリック後、ページBが表示されるまでの時間が「瞬時」ではなくて「1，2秒経過後」であってもそれは容認する２　最初にアクセスするページAがどうしても見えてしまう、というならば「ページAの表示内容、画像、テキストを白紙にする」「ページAの表示内容、画像、テキストをページBと同一（もしくは極力似させる）」という手法でごまかす方法もあるかもしれません。これは「ページAを表示させずに瞬時にページBにジャンプ」がどんな手法をもってしても不可能である場合は容認しますが、できればやりたくありません詳しい方、お願いします。

質問日時: 2021/09/10 14:31 質問者: s_end

解決済

7

0
Javascript のカプセル化について

Java の場合 private を使って以下のように書きますが、 class Dog { private String name; public String getter() { return this.name; } public void setter(String name) { this.name = name; } } Javascript の場合、カプセル化、どう書きますか ? クロージャという書き方のみでしょうか ? 以下、クロージャを使った際のデメリットとしてウェブにあった引用です。 class の話でしょうか ? -- クロージャを使うと、プロトタイプによるメソッドの定義指定ができなくなる。 -- つまり、継承など、プロトタイプを利用したことによるメリットが受けられなくなる。

質問日時: 2021/09/09 00:21 質問者: i-d-a-i

ベストアンサー

3

0
JavaScript正規表現について特定の文字列の場合、Trueを返したい

JavaScript正規表現について質問があります　特定の文字列の場合、Trueを返したい https://www.abc-def.jp/ →True https://www.abc-def.jp/event/ →True https://www.abc-def.jp/event/?xxxxx →True https://www.abc-def.jp/event/abc/ →False この内容で、testを使ってTrue/Falseを返すようにしたいです。 var reg = /xxxxx/; var check = reg.test("https://www.abc-def.jp/ "); このようにすると思うのですが、こちらのtestの部分を教えていただけるとありがたいです。（正規表現を勉強し始めで、正解からなぜそうなのかを考えながら勉強すると効率が良く、ご回答いただけると助かります）お手数ですがよろしくお願いいたします。

質問日時: 2021/09/04 17:13 質問者: kemukemu2014

ベストアンサー

3

0
正規表現の書き方を知りたいです。特定の文字列以外を抽出したい

正規表現の書き方を知りたいです。　特定の文字列以外を抽出したいです。 https://www.abc-def.jp/event/aaa/?xxx https://www.abc-def.jp/event/111/?xxx https://www.abc-def.jp/event/a1a/?xxx https://www.abc-def.jp/event/1a1/?xxx このような文字列において、 aaa 111 a1a 1a1 の部分だけを抽出するJavaScriptを知りたいです。 var str = window.location.href; var result = str.match(xxxxxxxxxx); result このように書くのはわかるんですが、肝心のmatch以降でどう書けばいいのかまだわからず・・・・どなたか教えてください。よろしくお願いします。

質問日時: 2021/09/04 13:07 質問者: kemukemu2014

ベストアンサー

3

0
JavaScriptの日付の比較

日付の比較する関数でreturnの部分の上3つの出力結果は一見正しく見えるようなのですが正しくないそうです、最後の行が正しいそうですその理由を説明お願いします function isToday(date) { const today = new Date(); return date.getTime() === today.getTime(); // ダメ return date.getDate() === today.getDate(); // ダメ return date.toUTCString() === today.toUTCString(); // ダメ return date.toDateString() === today.toDateString(); // OK } const tomorrow = new Date(); tomorrow.setDate(tomorrow.getDate() + 1); const yesterday = new Date(); yesterday.setDate(yesterday.getDate() - 1); console.log(isToday(new Date())); console.log(isToday(tomorrow)); console.log(isToday(yesterday));

質問日時: 2021/09/02 12:50 質問者: a_cham

ベストアンサー

1

0
javascriptでdivの中身を変更できるようにしたいです

javascriptでdivの中身を下記のように仕組みを作りたいのですが、思うようにできません。どなたかご教示のほどよろしくお願い致します。【HTML内に書く内容】 <article id="textbox"> <p>このエリアにHTML要素を追加する</p> </article> 【javascriptでやりたいこと】・上記＜ｐ＞の中身に<div>要素を入れて<ｐ>を複数作成したいです・<ｐ>の数は状況に応じて自由に数を調整したいです勉強しはじめな為、質問内容が不十分でしたら申し訳ございません。よろしくお願い致します。

質問日時: 2021/09/01 08:42 質問者: h_6812_h

解決済

7

0
Google Apps Scriptについて

Google Apps Scriptをスプシと連携させ2500×200=500000=O(10^5)ぐらいの二重のfor文を書いたら「関数の実行がタイムアウトしました。」と言われてしまったのですがどれぐらいまでならOKかご存知の方いらっしゃいますか？

質問日時: 2021/09/01 01:24 質問者: yappiy

解決済

1

0
スプレッドシート GASの繰り返し処理について例えばB1～C4の範囲で表があり、A1に好きな数字を

スプレッドシート GASの繰り返し処理について例えばB1～C4の範囲で表があり、A1に好きな数字を入力するようにして、A1に入れた数だけD列以降にB1～C4の表をコピペすることって可能ですか？ forで考えていたのですが、今のところ下のようなイメージで、iを列で考えて行は固定で良いと思ってるのですが、条件式のところはどうしたら良いでしょうか？ for(let i=4; ？？？; i+2) 伝わりにくかったらすみません。GAS初心者です。分かりにくいところを聞いていただけると助かります。

質問日時: 2021/08/26 16:15 質問者: 中山あ

ベストアンサー

2

0
JavaScriptで、あるクラス名が特定数以下の場合、ボタンを消したい

お世話になります。Jsを学び出し始めた初心者です。 Javascriptで、「あるクラスが特定数以下の場合、ボタンを消す」ということをしたいのですが、うまく動きません。ブラウザのコンソールでは、 Uncaught TypeError: gradBtnRemove.remove is not a function というエラーが出ていますが、調べて色々試したのですがうまくいかず… alert() で確認すると、数とかはきちんと取得されているようなのですが、 remove(); にした途端、動かなくなります。どこの書き方が悪いのでしょうか？どなたかご教授いただけると幸いです。 <!DOCTYPE html> <head> <style> .grad-btn { width: 40vw; height: 22px; display: block; margin: 50px auto; padding: 20px; background-color: #3a6689; color: white; text-align: center; vertical-align: middle; } </style> </head> <body> <section> <div class="item element2">aaa</div> <div class="item element2">bbb</div> <div class="item element2">ccc</div> <div class="item element2">ddd</div> <div class="item element2">eee</div> <label class="grad-btn" for="trigger1">続きを見る</label> </section> <script> const moreViewNoneJs = document.getElementsByClassName('item'); let lenJs = moreViewNoneJs.length; let gradBtnRemove = document.getElementsByClassName('grad-btn'); if (lenJs < 3) { gradBtnRemove.remove(); } </script> </body> </html>

質問日時: 2021/08/26 14:50 質問者: kotamagokotama

ベストアンサー

1

0
ナンバーズ 4 の数列をランダムで出力する JS を組んでいます。

上から 1, 2, 3, 4 桁で、ナンバーズ 4 の円盤と同じ数字の並びを配列にしてみました let num_1_digit = [ 1, 0, 9, 8, 7, 6, 5, 4, 3, 2 ]; let num_2_digit = [ 1, 8, 5, 2, 9, 6, 3, 0, 7, 4 ]; let num_3_digit = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 0 ]; let num_4_digit = [ 1, 4, 7, 0, 3, 6, 9, 2, 5, 8 ]; 現在、作っている部分は以下です。円盤は 1 秒間、約 3 回転している。円盤が止まるまでは約 0.2 秒。 let i = 0; let d = new Date while ( new Date() - d < 200 ) { } 円盤が止まるまでは約 0.2 秒は上記で概ね、良いと思いますが、円盤の秒間、約 3 回転を表現する方法がわかりませんでした。わかる方おりましたら、参考にさせて下さい。宜しくお願い致します

質問日時: 2021/08/23 18:03 質問者: i-d-a-i

ベストアンサー

3

0
一定時間ループさせて止めたい

let num = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 0 ]; let bool = true; function selectNum( isRotate ) { while ( bool ) { for ( let i = 0; i < num.length; i++ ) { console.log( num[i] ); } } bool = isRotate; } setTimeout( selectNum, 1000, false ); 一定時間ループさせて止めたいのですが、これだと 1 秒後待ったのちの処理になり、処理も継続のまま止まらず。実際の動作の希望は、 1 秒後ではなく、 1 秒ループさせ num の配列の 1 つを表示したいのですが、その方法がわかりません。わかる方おりましたら、教えてください。よろしくお願いいたします。

質問日時: 2021/08/22 21:11 質問者: i-d-a-i

ベストアンサー

2

1
MDN の文章での JS についての疑問

MDN にてこのような文章がありました。 ------ ------ ------ 引用 MDN IIFE (即時実行関数式) IIFE (Immediately Invoked Function Expression; 即時実行関数式) は定義されるとすぐに実行される JavaScript の関数です。 (function () { })(); このデザインパターンは自己実行無名関数 (en-US)とも呼ばれ、次の2つの主な部分から成ります。最初の部分はグループ化演算子 () に囲まれた静的スコープ付きの無名関数です。これは IIFE イディオム内で、汚いグローバルスコープと同様に変数へアクセスすることを防ぎます。 2つ目の部分は即時実行関数式の () で、これを通じて JavaScript エンジンは直接関数を解釈実行します。 ------ ------ ------ いくつか疑問があるのですが、汚いグローバルスコープとはなんでしょうか ? 静的スコープ付きの無名関数とはどんなものでしょうか ? わかる方おりましたら、よろしくお願いいたします。

質問日時: 2021/08/21 18:59 質問者: i-d-a-i

ベストアンサー

1

0
JavaScriptの定数名が取り消し線になる理由

VSCodeで以下のコードを書いた時にconsole.log内のnameに取り消し線が付き警告の様なものが出ます何が理由でこのようになってるのでしょうか？ const name = "sato"; console.log(name.toUpperCase()); 別なタブで同じコードを書いても同じ取り消し線は付いていないです問題のコードはそのページからコピペしたものです

質問日時: 2021/08/18 13:15 質問者: meiGo

解決済

3

0
JavaScriptとNode.js

を勉強しています下のコードを実行するとブラウザでは Sun Nov 01 2020 00:00:00 GMT+0900 (日本標準時)と表示されますが node.jsでは 2020-10-31T15:00:00.000Zと表示されます node.jsで出力される記号の意味が解らないのですがブラウザの日付と意味は同じで有ると判断できるものなのでしょうか？日付の計算で正しい値が出るのか疑問に思い質問しましたコード const d = new Date(2020, 10); console.log(d);

質問日時: 2021/08/18 10:42 質問者: meiGo

ベストアンサー

3

0
Javascrptの0の掛け算

Javascriptの0の計算についてお聞きします const n = 0; console.log(n * -1); としたときに 0と出力したいところが-0となってしまいます 0にマイナスが付かないような計算をするにはどうしたらいいですか？ nには0だけではなく正負の数値が入りますつまり符号を逆にしたいということですよろしくお願いします

質問日時: 2021/08/15 15:56 質問者: 響子ちゃんが好きです

ベストアンサー

3

0
DOMの操作

document.getElementByIdや、querySelectorを用いて HTMLの要素を取得する際、 chromeでいうところの「ソースを表示」で表示されるソースからは取得できるものの、そこには表示されず、開発ツールの「element」に表示されるDOMツリーに表示されるソース、すなわちJavaScriptで生成されているソースが取得できません。そういうものなのでしょうか？調べると、それも取得できるような感じがしていて、そうだとすれば何か考えられる原因はありますでしょうか？

質問日時: 2021/08/13 17:55 質問者: jan123

解決済

6

0
VSCodeとJavaScriptについて

VSCodeにてJavaScriptを始めたばかりの物です JavaScriptの関数内でインテリセンス機能が上手く働いていないのですが改善方法はありますか？例えば以下のようなコードを書いた時にsplitが補完されません関数の外では補完されますまた関数の外で1度でも使ったメソッドなどは関数内でも補完候補にあがりますおそらくメソッドとしてではなく過去の記述から候補にあげているだけのようです function f(str) { return str.split(' '); } const a = "abc def"; console.log(f(a));

質問日時: 2021/08/12 08:19 質問者: 4組の景ちゃんが好き

ベストアンサー

5

0
要素のリサイズをひろい、他の要素をそのサイズにしたい

初期サイズのみを拾い、リサイズ時は要素 x_01 をリサイズしてくれません。 x_01 も、x_02 と常時、同じサイズにしたいです。仮に html は div とします。わかる方おりましたら、よろしくお願いします ! let client_w = document.getElementById('x_02').clientWidth; let client_h = document.getElementById('x_02').clientHeight; const addStyleAttributeOneHundredthVP = () => { document.getElementById('x_01').style.width = client_w + 'px '; document.getElementById('x_01').style.height = client_w + 'px '; } window.addEventListener( 'DOMContentLoaded', addStyleAttributeOneHundredthVP ); window.addEventListener( 'load', addStyleAttributeOneHundredthVP ); window.addEventListener( 'resize', addStyleAttributeOneHundredthVP );

質問日時: 2021/08/10 16:12 質問者: i-d-a-i

ベストアンサー

3

0
GASを使ってGoogle Formの選択肢を作る方法を教えて下さい。

Google Formを使ってアンケートを実施します。設問は以下のとおりです。設問1(ラジオボタン) 設問2(ラジオボタン) 名前(記述式) メールアドレス(記述式) 設問3(ラジオボタン) 設問4(ラジオボタン) 設問5(ラジオボタン) 設問6(チェックボックス) 名前とメールアドレスは記述してもらい、設問6は選択肢から4つ選びます。その他は選択肢から1つ選びます。設問1、設問2、名前、メールアドレスは回答必須です。選択肢はどれも多く手作業でするのは大変ですし、同じような作業を今後もする可能性があるので、なんとかGoogle Apps Scriptを使ってできないかと考えています。こちらのサイトで選択肢を作成するスクリプトを見つけたのですが、複数の設問に選択肢をつけていくにはどうしたらいいでしょうか？ https://note.com/taraco123/n/nfcfede8adc4f 上記のサイトについては質問、コメントができないみたいなのでここに質問させていただきました。上記のサイトにあるスクリプトです。 function myFunction() { //スプレッドシートから選択肢情報を取得 var ss = SpreadsheetApp.getActiveSpreadsheet(); var sheet = ss.getActiveSheet(); var rows = sheet.getLastRow()-1; var values = sheet.getRange(2,1,rows,1).getValues(); var choices = values.flat();　//二次元配列を一次元配列に変換 //フォームに選択肢を反映 var form = FormApp.openById("1H24o4C5IqRtQBBvdZjRF6F2K0p_OMScPhky12j7bJKs"); var items = form.getItems(); items.forEach(function(item){ var title = item.getTitle(); if(title == "好きな小説家を選んでください"){ var choiceItem = item.asListItem(); //プルダウン設問として取得 choiceItem.setChoiceValues(choices); //選択肢を設定 } }); }

質問日時: 2021/08/10 11:05 質問者: CaveatEmptor

解決済

1

0
JavaScriptでconfirmを使いたいのですが、下記のようなコードを書くと、おかしな動作を

JavaScriptでconfirmを使いたいのですが、下記のようなコードを書くと、おかしな動作をします。正常に動くこともありますが、OKボタンを複数回クリックしなければ移動処理が始まらないことが多いです。どうもconfirmが呼ばれてOKボタンを押すと、何故か繰り返しconfirmが呼ばれているようです。 4,5回ほどOKボタンを押すと移動処理に入りますが、毎回ボタンを押さなければならない回数はランダムです。何故このような動作をするのか、考えられることはありますか？ if (confirm("移動しますか？") == true){ 　移動処理 } ボタンが押された時のイベントとして設定しています。上記コードの他にも前後にコードを書いていますが、ボタンやconfirmの処理に関わってくるようなものではありません。

質問日時: 2021/08/09 14:22 質問者: シロ-

ベストアンサー

1

0
文字のフォントの色で分岐するには？

google spreadsheetからgmailで送信しようと考えています。 A列に送信すべき日付が入っています。例えばA21に赤字(#ff0000)で「2021/08/04」と入力されているときは送信ではなく、下書きに出力したいと思っているのですが、if文でどのように書いたらいいのでしょうか？赤字でなければ送信します。 P.S.送信するところまではできています。

質問日時: 2021/08/04 20:46 質問者: cul-de-sac

解決済

3

0

←前の結果
1
2
3
4
5
6
7
8
9
10
11
12
...
20
次の結果→

【プログラミング・Web制作】に関するカテゴリ

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

質問する（無料）

【JavaScript】に関するコラム/記事

弁護士が語る「合法と違法を分けるオンラインカジノのシンプルな線引き」

「お金を賭けたら違法です」ーーこう答えたのは富士見坂法律事務所の井上義之弁護士。オンラインカジノが違法となるかどうかの基準は、このように非常にシンプルである。しかし2025年にはいって、違法賭博事件が相次...
釣りと密漁の違いは？知らなかったでは済まされない？事前にできることは？

知らなかったでは済まされないのが法律の世界であるが、全てを知ってから何かをするには少々手間がかかるし、最悪始めることすらできずに終わってしまうこともあり得る。教えてgooでも「釣りと密漁の境目はどこです...
カスハラとクレームの違いは？カスハラの法的責任は？企業がとるべき対応は？

東京都が、客からの迷惑行為などを称した「カスタマーハラスメント」、いわゆる「カスハラ」の防止を目的とした条例を、全国で初めて成立させた。条例に罰則はなく、2025年4月1日から施行される。この動きは自治体...
なぜ批判コメントをするの？その心理と向き合い方をカウンセラーにきいた！

今や生活に必要不可欠となったインターネット。手軽に情報を得られるだけでなく、ネットを介したコミュニケーションも一般的となった。それと同時に顕在化しているのが、他者に対する辛らつな意見だ。ネットニュース...