カテゴリー: JavaScriptの記事一覧
-
Reactで「Form submission canceled because the form is not connected」となる原因
現象 フォームのonSubmitイベントハンドラ にて、react-router-domを使ってhistory.push(‘xxx’)のように画面遷移を行うと、コンソールにForm submission canceled […]
-
【JavaScript】ドラッグアンドドロップAPIの使い方と動作しない時の原因
Drag & Drop APIとは Drag & Drop APIは要素をドラッグアンドドロップすることができるHTML5のAPIであり、ほぼ全てのブラウザで動作する。(※スマートフォンでは動作しない)h […]
-
JavaScript(ES2015, ES6)でオブジェクトをコピーする方法
概要 ES2015から導入された分割代入を使うと、オブジェクトのコピーを簡単に記述することができる。 ES5の場合 Object.assign()を使う。 0
-
【JavaScript】任意の位置へスクロールさせる方法
概要 JavaScriptで任意の位置へスクロールさせる方法はいくつかある。document.documentElement.scrollTopはブラウザのバージョンによっては動作しない。(Microsoft Edgeな […]
-
npm runコマンドとnpxコマンドの使い方
npm runコマンド (npm srcipts)とは? Node.jsをインストールすると、npm run xxxで任意のコマンドを実行できるようになる。これはnpm scriptsと呼ばれ、任意のコマンドのショートカ […]
-
【JavaScript】スクロール量(位置・座標)の取得方法
Windowのスクロール量 window.pageYOffsetで取得することができる。ただし、IE8以前は非対応のためdocument.documentElement.scrollTopとする必要がある。https:/ […]
-
【脱jQuery】JavaScriptだけで要素のwidth, heightを取得・設定する方法
jQueryのwidthメソッド、heightメソッドをJavaScriptだけで実装する方法をまとめました。 width, heightの取得 jQuery JavaScript 注意点 .widthと.heightは […]
-
【脱jQuery】jQueryのliveメソッド、 onメソッドをJavaScriptだけで記述する方法
概要 【脱jQuery】JavaScriptだけでイベント処理を行うでは、既に存在する要素のイベントハンドラを定義したが、jQueryのonメソッド(古いバージョンではliveメソッド)は要素が後から追加された場合でもイ […]
-
【JavaScript】ブラウザバック(戻るボタン)を無効化する方法
概要 JavaScriptのHistory APIでブラウザの戻るボタンを無効化することができる。 サンプル 処理内容の説明 window.history.pushState(null, null, null);履歴の先 […]
-
【脱jQuery】JavaScriptだけで要素のtop, leftを取得・設定する方法
jQueryのoffsetメソッドをJavaScriptだけで実装する方法をまとめました。 top, leftの取得 jQuery JavaScript top, leftの設定 jQuery JavaScript ※j […]
-
【脱jQuery】JavaScriptだけでイベント処理を行う
ページ読み込み完了時に処理を実行する jQuery JavaScript scriptタグにasync属性をつけた場合 <script src=”hoge.js” async属性></script> […]
-
【脱jQuery】JavaScriptだけでAJAX通信を行う
概要 脱jQueryのためのメモ。 Fetch APIを使うとXMLHttpRequestよりも簡単に処理を記述することができる。ただし、IEは非対応であるため、polyfillを使ってトランスパイルする必要がある。po […]