[javascript] タグが付いた質問
JavaScriptとは、プログラミング言語のひとつである。Javaと名前が似ているが、異なるプログラミング言語である。 オブジェクト指向のスクリプト言語であることを特徴とする。 実行環境が主にウェブブラウザに実装され、動的なウェブサイト構築や、リッチインターネットアプリケーションなど高度なユーザインタフェースの開発に用いられる。
2,726
質問
1
票
1
回答
39
閲覧数
jqueryでdivなどをdragしている最中にdrag対象の文字を変えてしまうとresize出来なくなってしまう
jqueryでdragしている間そのdivの内容の文字をtext()で変更すると
resizeが出来なくなってしまうのです。
詳しくはsnipetで実行してみてください。
jqueryのtext()の代わりに.get(0).innerTextに変更しても同じ現象が発生します。
text()の代わりにhtml()にしても同じ現象が発生します。
変更した後にもう一度draggable()...
0
票
1
回答
39
閲覧数
アコーディオン表示のテーブルのフィルターがうまく動作しない
実現したいこと
アコーディオン表示のテーブルに下記の動きをするフィルターを追加したい
小カテゴリのA,B,C,Dのセレクトボックスで任意の名前を選択すると、
名前が同じ行と選択した名前を含む中カテゴリのチーム名と大カテゴリのグループ名を表示
例: Cを選択した場合
困っていること
フィルターでB,C,Dを選択したときに不正表示になってしまう
...
0
票
0
回答
263
閲覧数
Lambda SDK for JavaScriptのV3移行に伴いコードを変更したが正常に動作しない
Lambdaで下記のV3のコードに変更しましたが正常に動作しません。
ご教示いただければ幸いです。
エラー内容は下記となります。
2023-09-21T05:51:46.332Z undefined ERROR Uncaught Exception {
"errorType": "Runtime.UserCodeSyntaxError"...
0
票
1
回答
77
閲覧数
react 18.3.0 の `use` による再レンダリングが複数回発生してしまう
react 18.3.0 の use を使ったfetchとSuspenseを行いたいのですが、複数回(ときには無制限)の再レンダリングが発生してしまっています。
解決方法を教えてください。
react: 18.3.0-canary-3ff846d10-20230724
next: 13.4.12
以下のコードでトップページを開くと画面にDoneが表示されるまでの間、render ...
0
票
1
回答
42
閲覧数
ハンバーガーメニューのボタンの設定
前提
現在JSのバニラ版のみでハンバーガーメニューを作成しています。
解決したい問題・エラー内容
現在このようなエラーが出てしまっていて動きません。
改善して3つ同時に動くような設定にしたいです。
Cannot read properties of undefined (reading 'toggle')
考察・試行した事
・最初は線全てにIDをつけて付け替えをしようかと思ったのですが、...
2
票
3
回答
377
閲覧数
「1」から「指定された数」までの数列を配列で作りたい
目的
数を指定して関数に渡します。
そうすると配列が作られて、1,2,3,4と順に配列に組み込まれていきます。
指定された数になるとその数が代入されてそこで止まり、配列が返されると思っていました。
よろしくお願いします。
原始コード
const createNum = (maxNum) => {
const ary_result = [];
for (let index = 1; ...
0
票
2
回答
770
閲覧数
React のルーティング設定で真っ白な画面が表示されてしまう
Reactの画面遷移のためにルーティングを学習中です。
下記のサイトを試しに自身で実施して実行すると、画面が真っ白になりました。
ルーティングの設定 | React Router v6 はじめでもわかるルーティングの設定方法の基礎
最初はサイトのソースをそのままコピー&ペーストで実行すると真っ白です。
そこで調査して、jsonファイルにhomepageを設定しましたが解決していません。
...
0
票
1
回答
239
閲覧数
選択したものに応じて、さらなる質問の分岐をさせたい
下記コードでは、3で選択したもの次第で、その該当の質問に進むよう作成をしたいのですが、エラーコードなども出ておらず、原因が不明です。
こちらのコードについて、修正の方法をご教授いただけますでしょうか?
仕様:
3で5つの質問が表示される。
→この質問の選択肢に応じて、質問を分岐させる
例えば → [ゲーム機について]を選択した場合、6へ飛ぶようにする
問題点(現状):
...
1
票
1
回答
52
閲覧数
入れ子にしたテーブルのアコーディオン表示がうまくいかない
実現したいこと
テーブルのアコーディオン表示で、大カテゴリを押下すると中カテゴリ(child)が表示され、中カテゴリ(child)を押下すると小カテゴリ(grand)を表示したい。
困っていること
大カテゴリを押下すると中カテゴリは表示されますが、中カテゴリを押下しても小カテゴリが表示されない。
試したこと
JSの動作を確認したところ、...
1
票
1
回答
685
閲覧数
モーダルをforeachすると、同じデータしか検出されない
使用技術
java,springboot,bootstrap,thymeleaf
実現したいこと
モーダルで確認動作を行った後、申請番号と申請ステータスを送信したいです。
問題点
モーダルを開いた後に申請番号の値が引き継がれておらず、送信されません。
thymeleafにてbootstrapを使い、テーブルをforeachさせているのですが、
...
0
票
1
回答
145
閲覧数
ボタンを押したら対応する入力フォームが表示されるようにしたい
質問
後述のphpファイルにて以下のような動作を意図しています。
buttonを押す
buttonに対応するidが、JavaScriptの.getElementByIdへ
JavaScriptの.addEventlistener('click')、にて、押したbuttonのidと対応する入力フォームが表示される。
押したbutton以外の入力フォームは非表示になる。
しかし、...
0
票
1
回答
116
閲覧数
LINEで送信した内容をX(旧Twitter)の下書きに保存したい
実現したいこと
LINEから送信した内容を、X(旧Twitter)の下書きに保存する
前提
LINE Messaging API、Twitter API、GASを使ってLINE上で
X(旧Twitter)にポストできるようなシステムを作成しています。
APIを取得後、いざGASでコードを書く際にエラーが発生してしまいました。
(Bardを参考に作成したコードなので、...
2
票
1
回答
217
閲覧数
brewでnodeをインストールせずにyarnをupgradeする方法
nvmやndenvを使っている場合、brewでyarnをインストールするときはbrewでnodeが入らないように以下のように--ignore-dependenciesをつけると思います。
$ brew install yarn --ignore-dependencies
この場合、yarnのupgradeはどのようにすればいいでしょうか?
以下、失敗した方法です。
$ brew ...
0
票
1
回答
1,013
閲覧数
名前とニックネームを3回追記したらボタンを非表示にし、それ以降は追記できないようにしたい
javascriptを学習しております。
名前とニックネームを3回追記したらボタンを非表示にし、それ以降は追記できないようにしたいです。
3回目以降は追記できないようにしましたが、ボタンを非表示にできておりません。
また、tableタグとそれに関連するタグを利用し、追記した 名前 と ニックネーム を最大3人分までテーブル表示できるようにしなさい。データを3件追記して追加ボタンを消すようにしたが、...
0
票
1
回答
98
閲覧数
テーブルのアコーディオン表示について
実現したいこと
HTML、javascripyを使用してテーブルのアコーディオン表示を綺麗に表示したい
試したこと
パターン1:同じテーブル内にdetailの情報を追加
https://codepen.io/st410gaku/pen/xxmEeRB
パターン2:trにtd,tableを追加し、detailの情報を追加
https://codepen.io/st410gaku/pen/...
0
票
1
回答
719
閲覧数
ESLintでVueファイルのエラーを解消できない
事象概要
Vue3の環境にESLintを導入した後に、Vueファイルにおいて理解できないエラーが発生しており解消できてないです。
コメント箇所でエラーが出ていたり、特段問題なさそうな箇所でエラーが出ているので、ESLintが出しているエラー内容と実態が合致しないように感じます。
.eslintrc.json
{
"env": {
"browser&...
1
票
1
回答
41
閲覧数
ESLintとPrettierの設定ファイルを複数のプロジェクトから共通設定として参照したい
ローカルで複数のプロジェクトを開発する場合、一つ一つのプロジェクトでESLintとPrettierの設定ファイルを作るのではなく、共通の設定ファイルを参照するようにしたいです。
また、チーム開発しているプロジェクトではそのプロジェクトの設定ファイルがあるのでそれを使うようにしたいです。
いい方法はあるでしょうか?JetBrains社のエディタ(WebStormなど)での開発を想定しています。
2
票
0
回答
198
閲覧数
VSCodeでファイル保存時にPrettierのみを走らせたい
前提・実現したいこと
Visual Studio Code(VSCode)でJavaScriptのファイルを保存した時にPrettierのみを走らせたい。
発生している問題・エラーメッセージ
ファイル保存時にPretterでフォーマットしたく、VSCodeのPrettierの拡張を入れ、"editor.formatOnSave": trueに設定しています。
...
0
票
1
回答
820
閲覧数
es6でclassを定義したとき、eslint(no-shadow: 2)を通らない理由を知りたい
babelを使用してes6でjsを書いています。
linterをjsxhintからeslintへ変更し、.eslintrcのno-shadowを2にしてチェックしたのですが、以下のような注意がでます。
CLASS is alrerady declared in the upper scope. (no-shadow)
※ CLASSは定義したclass名です
no-...
0
票
0
回答
958
閲覧数
一度表示されたESLintのErrorがバグ修正後も表示され続ける(Nuxt.js)
一度表示されたESLintのErrorが、バグ修正後も表示され続けてしまいます。
バグ修正後に.eslintcacheファイルを削除して、アプリケーションを再起動するとエラーは表示されなくなります。
キャッシュファイルを削除せずとも、修正後はエラーが更新されるようにしたいです。
詳細
create-nuxt-appでアプリケーション作成後、index.vueを以下のように作成しました。
(...
0
票
1
回答
179
閲覧数
ESLintで名前付き引数でErrorが出ないようにする方法
環境
Node.js v10.10.0
ESLint v5.13.0
質問
以下のコードの名前付き引数min, maxで、Errorが発生します。
const randomIndex = random.int(min=0, max=10);
error 'min' is not defined no-undef
error 'max' is not defined no-...
3
票
1
回答
6,238
閲覧数
ESLintのno-unused-expressionsの直し方
Vue Test Utilsのcontains(selector)の章と、Chaiの.trueの章を読んで、以下のようなテストを書いたのですが、ESLintに怒られてしまいました。
ESLintのDisallow Unused Expressions (no-unused-expressions)のページを読んだのですが、よくわかりません、
どう直せばいいのでしょうか。
なお、...
0
票
1
回答
721
閲覧数
ESLintで、特殊なインデントでエラーが出ないようにしたい
こんにちは。
自分は、JavaScriptの var の巻き上げ問題に対処したく
varでの変数宣言は、なるべく先頭で書こうと思い
また、開発中に変数をコメントアウトすることもよくあるので
このような書き方をしようと思っています。
行末に必ずカンマがくるスタイルです。
var test01 = function () {
var
a,
b,
c,
varend;...
0
票
1
回答
136
閲覧数
Nuxt.jsのESlintとPrettierについて
Nuxt.jsの初学者です。Nuxt.jsのプロジェクトの作成をする際にESLintの利用を選択すると.eslintrc.jsが自動的に作成されpackage.jsonにもeslintが書かれているとことだったのですが作成したプロジェクトには.eslintrc.jsがありません。
nuxt-test
├── README.md
├── assets/
├── components/
├── ...
0
票
1
回答
2,565
閲覧数
reactで複数のチェックボックス(全選択・全解除)実装したい
現在、next.jsで実装を進めているのですが、上記にある通り、複数のチェックボックスのチェック状態をstateで管理、また違うコンポーネントにあるボタンを押すとチェック状態が全選択もう一度押すと全解除というような実装をしたいのですが、どのようにすれば良いのか見当がつきません。
また、複数のチェックボックスというものはapiのデータから作られており、子コンポーネントでmapで回している状態です。
...
0
票
0
回答
65
閲覧数
環境構築後、特定のアドレスへアクセスした場合にエラーが出てしまう
以下のリポジトリですが、自分が環境構築した際はエラーは出なかったのですが、他の方にして頂いた際に、エラーが出てしまいました。
https://github.com/newyee/nuxt-site
エラー内容は以下になります
Cannot find module './src/algoliasearch.helper'
こちらはローカル環境実行後、 localhost:3000/ja/...
4
票
1
回答
778
閲覧数
OWASP (zap) にてURLエンコードされていないパラメーターを持つURLにアクセスしたい
概要
構築しているサイトの脆弱性を発見したく、OWASP(zap) D-2017-02-27を利用しています。
URLエンコーディングされていないURLへアクセスを行い、XSSが発生していないか確認したいと考えています。
OWSPの規定のxssの動作では検出できない、特定のパラメーターを持つアクセスを行いたいと考え、ActiveRulesへJavaScriptを追加しましたが、...
0
票
1
回答
1,026
閲覧数
javascriptで移動直前に移動先URLにパラメータを追加したい
URLにつけられるコンバージョンタグを移動先にも引き継ぎたいと思っています。
aタグならば、事前にhrefに追記することで実現可能ですが、
JSによる移動の場合はできません。そこで移動直前に調整しようと考えました。
下記のようなコードにて、Aタグ、もしくはJSで移動直前にURLの一部にパラメータを付加しようとしています。
実現したいことは2つになります。
1)移動先のURLを取得したい
2)...
0
票
1
回答
42
閲覧数
アコーディオンの開閉によって変わる高さをgsapに伝えたい
test1をスクロールに合わせて、画面内にでてきたらfadeInさせたいです。
ブラウザを読み込み、そのままスクロールするだけでしたら問題ないですが、
スクロールしたい要素の上にある.accordion-title 詳しくはこちら を開いた状態でスクロールすると、開閉により高さが変わり、test1がブラウザに出て来る前にfadein済みになってしまいます。
...
1
票
1
回答
3,839
閲覧数
jQueryプラグインの「slick」を利用しつつランダム表示させたい
slickを利用したカルーセルをランダムに表示するようしたいのですが、ランダム表示にはなっているものの、下記3点の不具合があり解決方法をご教授いただけますと幸いです。なお、カルーセルさせる画像の枚数は10点としています。
全10点の画像のうち1点が2回(どの画像になるかはその都度変わります)表示される
(意図通りに)表示されない画像が1点ある
最後の画像(10枚目)から最初の画像(1枚目)...
0
票
0
回答
40
閲覧数
スクロールに合わせてfadeInしたいが、ブラウザが開かれたタイミングでfadeInされてしまう
スクロールに合わせてfadeInしたいですが、ブラウザが開かれたタイミングでfadeInされてしまいます。
コンソールにエラーはでておりません。
fadeInの動きはできているので、問題なく読み込みされてるかと思うのですが
fadeInのタイミングだけスクロールにあって動きません。
初歩的な質問で恐縮ですが、よろしくお願い致します。
<div class="test"&...
0
票
1
回答
1,887
閲覧数
rails で 画像アップロードの前に既存画像と入れ替えてプレビューしたい
画像プレビュー時に、既存画像の横に、新規プレビュー画像が出ます。
既存画像と入れ替えるように、表示させるにはどうしたら良いでしょうか?
よろしくお願い致します。
<div class="field">
<%= image_tag @user.picture.url if @user.picture? %>
<%= f.label :picture, '画像' ...
0
票
0
回答
53
閲覧数
レスポンシブ対応のドロップダウンメニューがうまく作れません。
コーディング初心者です。レスポンシブ対応のドロップダウンメニューがうまく作れません。
どこを直せば添付した画像の通りSP版PC版整ったかたちになるでしょうか?
$(function(){
// ハンバーガーメニュー
$("#drawer_toggle").click(function(){
$(this).toggleClass("...
0
票
0
回答
76
閲覧数
Ruby on Rails で作成したアプリケーションについての質問です
ゲストログイン機能を実装し、ゲストログインしている時のみ、画面上部に「current_or_guest_user.email」とポップアップがページ遷移毎表示されます。
不要なので表示させたいようにしたいのですが原因と解決方法がわかりません。
検証ツールで確認しても特にエラーは表示されません。
解決方法をご存知の方いらっしゃいましたらご教授ください。
user.rb
def self....
0
票
0
回答
45
閲覧数
history.scrollrestoration の設定はページ遷移で引き継がれない?
質問
history.scrollrestoration の設定はセッション履歴エントリ(session history entries)に保存されるため、
一度'manual'に設定すると戻る・進むでページを遷移しても設定は変わらないと思うのですが、
実際には'manual'に設定後にページを戻った場合はスクロール位置が復元されて、
historyにはデフォルトの'auto'が設定されています。
...
0
票
0
回答
82
閲覧数
SSL通信をしていないローカルマシンに接続して位置情報を取得する方法
Tomcat9で動作するJavascriptです。(動作していませんが)
これをローカルホストで動かし「IPアドレス:ポート」のようにURLに打ち込みブラウザに表示させることは出来ますが
この位置情報を取得するJavaScriptは動かず「位置情報の取得が許可されていません」というエラーになります。
しかしブラウザもスマートフォン端末の設定も許可しています。
...
0
票
1
回答
47
閲覧数
スクロールバーが二重に表示されるページ(Bluesky, bsky.app)で`window.scrollTo()`が働かない
他に同様のサイトがあるかはわかりませんが、Blueskyではブラウザのスクロールバーと別にページ内部にもスクロールバーが表示されます。そしてwindow.scrollTo()ではブラウザのスクロールバーを動かすことはできても、内部のスクロールバーは動かせないので実質的に働きません。
bodyタグにoverflow-y: autoが指定されてる事が原因かとも思いましたが、以下のようにしてもダメでした。...
0
票
1
回答
60
閲覧数
XLSX.writeメソッドは、修正したフォントカラーのスタイルを保持できないのか?
javascriptを用いて、エクセルの修正を試みている際に生じた事象についてです。
(ライブラリは、xlsx使用 https://www.cdnpkg.com/xlsx/file/xlsx.full.min.js/?id=78603#)
指定したセルに入っている値のフォントカラーを変更する命令をする。
その命令後に、そのファイルをダウンロードするが、毎回フォントカラーが変更されずに、出力される。
...
0
票
0
回答
39
閲覧数
fadeInがSPに効かず、PCのみに効く blockが原因の理由
jQueryでanimate__fadeInLeft、PCでは効きますが、SPでは左からからでなく
ただのfadeInになってしまいました。
<section class="container">
<div class="contents1">
<picture class="...
0
票
0
回答
34
閲覧数
<v-navigation-drawer>がfooterの横にまで来てしまっている
ある要素に設定するスタイルのheightの値を動的に設定したいと考えています。具体的には、一番下までスクロールしていた時は、heightの高さを77.5%、まったくフッター要素が見えていないときは、100%,フッターが見えていた場合は、見えている数値分100%から高さを引きたいと考えています。
下記handleScrollにて色々と試してみたのですが、うまいこと高さを調整することが出来ません。...
0
票
1
回答
73
閲覧数
JavaScript文法 インスタンスに対するprototypeの位置づけ
次のソースコードは何故、上手くいかないのでしょうか?
■ソースコード■
function Fn4(a, b) {
this.a = a;
this.b = b;
}
/* prototypeに引き込みたい関数オブジェクトproto_method */
function proto_method() {
console.log("proto method is ...
1
票
2
回答
380
閲覧数
discord.jsで返信の際に言及しないようにしたい
下記のコードを実行したらメッセージは返信されましたが言及されてしまいました。
どなたか言及されない方法を教えてください。
v13です。
message.reply({
content: "hoge"
allowedMentions: {
parse: []
}
})
1
票
1
回答
111
閲覧数
YouTubeの動画を埋め込んだ際、アイコン等で動画が隠れないようにしたい
YouTubeの動画をYoutube iFrame Player APIを使用して埋め込みました。
コントローラを非表示にしているため、YouTubeロゴやチャンネル登録ボタン、後で見るボタン、共有ボタンが動画再生後、一定時間表示されてしまいます。
仕様上、避けられないため、動画の上と下に余白を設け、ボタン類で動画が見づらくなる事態を避けたいと思います。
現状は、...
0
票
1
回答
122
閲覧数
サーバー管理botのエラー(Discord.js)
Discord.jsを用いてBotを作成しているものです。
このbotには、以下の機能が搭載されています。
<ロール管理>
・!login ロール名:ロール取得
・!logout ロール名:ロール剥奪
<サーバー管理>
・testロール所有者の送信テキストの代理送信
・mutedロール所有者の送信テキストの削除
コードの記述順は上の通りです。
...
1
票
1
回答
111
閲覧数
セルに貼り付けたURLのHTMLをログに展開したい
スクレイピング用ライブラリの使い方
上記サイトからCheerioライブラリを使用して、ログにホームページのHTML情報を出力したいのですが、うまくいきません
下記のコードは何が間違っているのでしょうか?
function textAndAddClass() {
var spreadsheet = SpreadsheetApp.getActive();
var sheetURL =...
1
票
1
回答
154
閲覧数
TypeScript をコンパイルして実行すると exports is not defined というエラーが出る
TSでGSAPを読み込んでコンパイルまでは上手くいくのですが、JSの時点で下記エラーが表示されます。
tsconfig.jsonの値はいろいろ変えてみたのですが、どうしてもうまくいきません。
何が問題なのでしょうか。どなたか教えて頂けないでしょうか。
エラーメッセージ:
Uncaught ReferenceError: exports is not defined
Object....
0
票
0
回答
57
閲覧数
React-hook-formのRegisterを使った場合の値の受け渡しについて
ReactとNext.jsでWEBアプリを作っています。
メインのコンポーネントであるAppと、textarea専用のTextInputコンポーネントがあり、App内でTextInputコンポーネントを呼び出しています。
コンポーネントは分割した状態でないといけないのですが、できればregisterをつかった状態で、Appで入力された値をTextInputコンポーネントに渡す方法はないでしょうか。
...
0
票
1
回答
178
閲覧数
タグ名の変動するサイトからスクレイピングを行いたいです。
会社名をスクレイピングしたいのですが、同じサイトでも会社によってタグの数字が変化します。
以下のページで紹介されているParserは、Webスクレイピング用のライブラリです。
【GAS】Parserライブラリの使い方|インストール手順と使用方法
例:
<a href="/2024/company/r308300069/">
<a href="/...
0
票
0
回答
53
閲覧数
【googleフォームとスプシの連携】設定した質問のプルダウンを、シートから引っ張りたい。
”従業員”というフォーム内の質問の回答にプルダウンで回答してもらいます。
スプシの「プルダウン」タブ,K2:Kがプルダウンに入る内容です。(K1はタイトルです)
というわけで、以下のコードを作成しましたが、エラーが出てしまい上手くいきません。
2つのサイトを参考にやったのですが、、、ご教授ください。
function empList() {
/**
// スプレッドシートの情報を取得する
...
0
票
2
回答
135
閲覧数
Promiseチェーンの仕様が理解できません
JavaScriptの非同期処理、Promiseを学習しています。
Promise構文において、thenメソッドの返り値は新しいPromiseインスタンスというところまでは理解できました。しかしその点を知ったことで、かえってわからなくなってしまったことがあります。
resolvePromise = new Promise((resolve)=>{
resolve('成功');
})
...