質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

2242閲覧

javascriptにてイベントの発火を阻止する方法を知りたいです

hplpjpd

総合スコア20

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/05/18 15:17

編集2019/05/19 00:25

前提・実現したいこと

onclickによる発火時のみ一時的にonscrollの発火を止めたいです。
(onalick内でスクロール処理を実行します。)

発生している問題・エラーメッセージ

onscrollの発火が止まりません。
window.onscroll = fatalError;をコメントアウトすると発火が止まりますが、
定常的に止まってしまう?ため、コメントアウトは避けたいです。

該当のソースコード

test6.html
//質問のため、非生産的な処理
//クリックで1000pxへスクロール
//スクロール時に先頭へスクロール
//→現在の実装では競合してクリック時先頭へスクロール←クリック時は1000pxスクロールさせたい

<script> window.onload = function () { var t = ""; for (var i = 0; i < 1000; i++) { t += "<div>第" + i + "章</div>" } document.body.insertAdjacentHTML("beforeend", t); } window.onclick = function () { window.onscroll = ""; window.scroll(0, 1000); window.onscroll = fatalError; event.stopPropagation(); event.preventDefault(); return false; } window.onscroll = fatalError; function fatalError() { window.scroll(0, 0); console.log("unrecoverable error"); } </script> <body> </body>

試したこと

特になし

補足情報(FW/ツールのバージョンなど)

Google Chrome
バージョン: 74.0.3729.131(Official Build) (64 ビット)

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2019/05/18 15:25

(質問文は編集できます)質問文のコードはコードブロックで囲んでいただけませんか? ```(バッククオート3つ)で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。
hplpjpd

2019/05/19 00:26

連絡頂き、ありがとうございます! 修正致しました。
think49

2019/05/23 23:32

回答にコメントし、問題解決作業を進めて下さい。手元の環境で回答のコードは期待通りに動きました。
guest

回答2

0

JavaScript

1'use strict'; 2function handleScroll (event) { 3 console.log(event.type); 4} 5 6function handleClick (event) { 7 console.log(event.type); 8 event.currentTarget.defaultView.removeEventListener('scroll', handleScroll, false); 9} 10 11document.addEventListener('click', handleClick,false); 12window.addEventListener('scroll', handleScroll, false);

Re: hplpjpd さん

投稿2019/05/19 01:33

think49

総合スコア18156

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

無理やりスクロールの終わりを待ってみる方法。

JavaScript

1var flag = false; 2var timer_id; 3window.onload = function () { 4 var t = ""; 5 for (var i = 0; i < 1000; i++) { 6 t += "<div>第" + i + "章</div>" 7 } 8 document.body.insertAdjacentHTML("beforeend", t); 9} 10window.onclick = function () { 11 if ( timer_id ) window.clearTimeout( timer_id ); 12 flag = true; 13 window.scroll(0, 1000); 14 timer_id = window.setTimeout( function () { flag = false; }, 500 ); // スクロールの終わりを待ってみる 15 event.stopPropagation(); 16 event.preventDefault(); 17 return false; 18} 19window.onscroll = fatalError; 20 21function fatalError() { 22 if ( flag ) return; 23 window.scroll(0, 0); 24 console.log("unrecoverable error"); 25} 26```**動くサンプル:**[https://jsfiddle.net/4q8u1za0/](https://jsfiddle.net/4q8u1za0/)

投稿2019/05/21 12:23

kei344

総合スコア69366

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hplpjpd

2019/06/23 13:04

皆様回答頂きありがとうございます。終わりを待てばよいのですね... 新しく知識が増えました、ありがとうございます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問