JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける=荒らしです
+ JavaScript の質問用スレッド vol.133 +
■ このスレッドは過去ログ倉庫に格納されています
2018/04/16(月) 00:09:43.45ID:???
446440
2018/05/12(土) 20:25:28.30ID:??? だから俺はソースplzとだけ書いているわけだな
2018/05/12(土) 20:37:57.70ID:???
ソースはイルミナティによって隠蔽されているためありませんが、本当です。信じてください。
2018/05/12(土) 21:01:24.61ID:???
そんなことを言ったら例えばJSではセミコロンが省略できるので
セミコロン無しで使うことが主に想定されてると言えるからな
つうか逆に組み立てて言えば
基本的にセミコロン無しで使える言語を望んで生み出された言語が
セミコロン無しで使うことが主に想定されてると言えるわけで
ならアロー関数が
主に一行で書く関数の理想の姿として作られたかというとそうではないわな
セミコロン無しで使うことが主に想定されてると言えるからな
つうか逆に組み立てて言えば
基本的にセミコロン無しで使える言語を望んで生み出された言語が
セミコロン無しで使うことが主に想定されてると言えるわけで
ならアロー関数が
主に一行で書く関数の理想の姿として作られたかというとそうではないわな
2018/05/12(土) 21:12:44.34ID:???
イルミナティならしょうがない
2018/05/12(土) 21:13:05.05ID:???
素朴な疑問です
以下ネットから拾ったソースなんですが
const version = "ES6";
if (version === "ES5") {
console.log("ECMAScript 5");
} else if (version === "ES6") {
console.log("ECMAScript 2015");
} else if (version === "ES7") {
console.log("ECMAScript 2016");
}
最後にelseがないこういうケースの場合elseで繋げる必要性はありますか?
if(){}
if(){}
if(){}
こう書くのと違いがあるのかないのかを教えて欲しいです 速くなるとかあるんでしょうか?
どなたか宜しくお願いします
以下ネットから拾ったソースなんですが
const version = "ES6";
if (version === "ES5") {
console.log("ECMAScript 5");
} else if (version === "ES6") {
console.log("ECMAScript 2015");
} else if (version === "ES7") {
console.log("ECMAScript 2016");
}
最後にelseがないこういうケースの場合elseで繋げる必要性はありますか?
if(){}
if(){}
if(){}
こう書くのと違いがあるのかないのかを教えて欲しいです 速くなるとかあるんでしょうか?
どなたか宜しくお願いします
2018/05/12(土) 21:18:08.40ID:???
=== ES5だったら他の分岐試すの無駄だろ
2018/05/12(土) 21:19:15.23ID:???
versionに"ES7"が入ってるときは変わらない
versionに"ES5"や"ES6"が入ってるときは上のif elseの方が速い
versionに"ES5"や"ES6"が入ってるときは上のif elseの方が速い
2018/05/12(土) 21:19:24.06ID:???
>>1-451
突っ込まれて反論できなくなったら他人の振りします
突っ込まれて反論できなくなったら他人の振りします
2018/05/12(土) 21:25:20.64ID:???
>>451-452
あ、、、!なるほど、ありがとうございます
あ、、、!なるほど、ありがとうございます
2018/05/12(土) 21:44:44.98ID:???
>>436
> .forEach(v => {console.log(v);})などは想定されていないと。
.forEach(v => console.log(v))
こう書いたほうがスッキリするで?
> .forEach(v => {console.log(v);})などは想定されていないと。
.forEach(v => console.log(v))
こう書いたほうがスッキリするで?
2018/05/12(土) 21:46:20.23ID:???
>>448
> 主に一行で書く関数の理想の姿として作られたかというとそうではないわな
ちょっと違うな。結果として一行にはなるが、
「関数値」のようなものだな。
関数は定義してから、呼び出す。
でもアロー関数の場合は、関数の値化して渡すって感じ
> 主に一行で書く関数の理想の姿として作られたかというとそうではないわな
ちょっと違うな。結果として一行にはなるが、
「関数値」のようなものだな。
関数は定義してから、呼び出す。
でもアロー関数の場合は、関数の値化して渡すって感じ
2018/05/12(土) 21:49:25.04ID:???
2018/05/12(土) 21:50:47.02ID:???
2018/05/12(土) 23:00:06.83ID:???
ふと思ったんですがSPAだとIDのバッティングが容易に起きますよね
たとえばモーダルウインドウにフォーム要素を表示する場合、
そのフォーム要素一つ一つにIDをふると、同じIDが複数の要素に対してふられるような状況が容易に発生します
SPAではIDをふらずに属性セレクタを使って指定するようにしたりして
極力IDをふらないようにした方がいいのでしょうか?
たとえばモーダルウインドウにフォーム要素を表示する場合、
そのフォーム要素一つ一つにIDをふると、同じIDが複数の要素に対してふられるような状況が容易に発生します
SPAではIDをふらずに属性セレクタを使って指定するようにしたりして
極力IDをふらないようにした方がいいのでしょうか?
2018/05/12(土) 23:03:50.35ID:???
容易に起きません
2018/05/12(土) 23:12:36.65ID:???
>>460
SPA作ったことありますか?
たとえばtitleというような一般的な名前は複数の文脈で使われるのでぶつかりやすいですし
エリアにふるIDと要素にふるIDもぶつかりやすいです
IDは言ってみればグローバル変数みたいなものなのですよ
SPA作ったことありますか?
たとえばtitleというような一般的な名前は複数の文脈で使われるのでぶつかりやすいですし
エリアにふるIDと要素にふるIDもぶつかりやすいです
IDは言ってみればグローバル変数みたいなものなのですよ
2018/05/12(土) 23:26:50.90ID:???
idに一般的な名前つけるセンスwww
2018/05/12(土) 23:27:56.83ID:???
つーかサンプルを示してくれたほうが伝わりやすいと思う
2018/05/12(土) 23:28:47.16ID:???
> 極力IDをふらないようにした方がいいのでしょうか?
はい
はい
2018/05/12(土) 23:39:28.27ID:???
設計や実装がアホだと容易にバッティングするかもしれないな
そのようなアホを営業にでも配置転換すればよい
そのようなアホを営業にでも配置転換すればよい
2018/05/12(土) 23:44:54.51ID:???
2018/05/12(土) 23:50:15.72ID:???
>>450
最適化というものがあるので速度は変わらないと考えるべき
最適化というものがあるので速度は変わらないと考えるべき
2018/05/12(土) 23:53:03.92ID:???
>>467
これ最適化されんの?
これ最適化されんの?
2018/05/13(日) 00:58:30.83ID:???
>>461
IDは極力使わない。
俺がIDを使う時は、”サイト全体で" 一意になる時
ページのIDとしてしか使わない
IDはページ内で一意であればいいんだが、ある時
ページを縮小したプレビューを複数、1つのページに表示する
ということをやった時にぶつかってしまったから
基本的にいらねぇよなぁを突き詰めていったら
ページのIDだけで十分となった
IDは極力使わない。
俺がIDを使う時は、”サイト全体で" 一意になる時
ページのIDとしてしか使わない
IDはページ内で一意であればいいんだが、ある時
ページを縮小したプレビューを複数、1つのページに表示する
ということをやった時にぶつかってしまったから
基本的にいらねぇよなぁを突き詰めていったら
ページのIDだけで十分となった
2018/05/13(日) 01:03:41.58ID:???
アロー関数についてWebArchiveも使って関連資料や立案者のBEのコメントなどをできる限り探ってみたんだが
結局JSに取り入れられる際に新しく思案されたのはthisの取り扱いくらいで
アロー関数自体は新しいものではなく関数を短く書きたいというモチベーションが確かにあって
他にも案があった中、BEがCSやC#から輸入したものであるので、その言語でどうして実装されたかを調べよう
CSはアローをどこから輸入したのかハッキリとはわからなかったが、
GitHubの最初の方のコメントをざっと読んでいくとアロー関数関連の話中に
開発陣が度々Haskellのことを引き合い出してるのでそこからだろう
ソースは不明だがWikipediaの影響を受けた言語の中にも確かにある
C#の方の調査は手を抜くが公式では「ラムダ式」と呼ばれている
Haskellのものも含めてこれらは究極的にはラムダ計算に由来している
そこまで調べたところでどうでも良くなった
結局JSに取り入れられる際に新しく思案されたのはthisの取り扱いくらいで
アロー関数自体は新しいものではなく関数を短く書きたいというモチベーションが確かにあって
他にも案があった中、BEがCSやC#から輸入したものであるので、その言語でどうして実装されたかを調べよう
CSはアローをどこから輸入したのかハッキリとはわからなかったが、
GitHubの最初の方のコメントをざっと読んでいくとアロー関数関連の話中に
開発陣が度々Haskellのことを引き合い出してるのでそこからだろう
ソースは不明だがWikipediaの影響を受けた言語の中にも確かにある
C#の方の調査は手を抜くが公式では「ラムダ式」と呼ばれている
Haskellのものも含めてこれらは究極的にはラムダ計算に由来している
そこまで調べたところでどうでも良くなった
2018/05/13(日) 01:15:19.16ID:???
CoffeeScriptでは
thisをバインドしないアロー関数(->)と
thisをバインドするファットアロー関数(=>)の
二種類があるんだよな。
JavaScriptで採用されたのは前者のみ(書き方は=>なんだがw)
単に短く書きたいのであれば、DOMイベントハンドラなんか
後者が有ったほうが便利と思うはずんだが採用されなかった
これもさ、アロー関数が、それは関数じゃなくて値っぽく考えるべし
と考えれば、thisが変わらないのも納得できるんだよな
アロー関数は短く書きたいと同時に、thisを気にしなくて良いものとして
必要だったんだと思うよ
thisをバインドしないアロー関数(->)と
thisをバインドするファットアロー関数(=>)の
二種類があるんだよな。
JavaScriptで採用されたのは前者のみ(書き方は=>なんだがw)
単に短く書きたいのであれば、DOMイベントハンドラなんか
後者が有ったほうが便利と思うはずんだが採用されなかった
これもさ、アロー関数が、それは関数じゃなくて値っぽく考えるべし
と考えれば、thisが変わらないのも納得できるんだよな
アロー関数は短く書きたいと同時に、thisを気にしなくて良いものとして
必要だったんだと思うよ
2018/05/13(日) 01:25:42.37ID:???
猿と人間の中間がいないのもさ、神様みたいな行為存在が俺たち人間を作ったと考えれば納得できるんだよなwww
2018/05/13(日) 01:26:25.63ID:???
> これもさ、アロー関数が、それは関数じゃなくて値っぽく考えるべし
> と考えれば、thisが変わらないのも納得できるんだよな
___ ━┓
/ ―\ ┏┛
/ノ (●)\ ・
. | (●) ⌒)\
. | (__ノ ̄ |
\ /
\ _ノ
/´ `\
| |
| |
> と考えれば、thisが変わらないのも納得できるんだよな
___ ━┓
/ ―\ ┏┛
/ノ (●)\ ・
. | (●) ⌒)\
. | (__ノ ̄ |
\ /
\ _ノ
/´ `\
| |
| |
2018/05/13(日) 01:30:40.85ID:???
bindする方採用しなかったのはfunctionが既にあるからだろうが。
短くしたいのが理由ならfunctionと被ろうがbindする方のアローも入れてたはずだろう。
方々から集めた情報すべてに自分の妄想をサポートさせようとして矛盾しまくってるな。
おまえの妄想がセンスないからそうなっちゃうんだと思うよ。
短くしたいのが理由ならfunctionと被ろうがbindする方のアローも入れてたはずだろう。
方々から集めた情報すべてに自分の妄想をサポートさせようとして矛盾しまくってるな。
おまえの妄想がセンスないからそうなっちゃうんだと思うよ。
2018/05/13(日) 01:32:48.61ID:???
だからそう言ってるじゃん。
単に短くしたいだけじゃなくて、
値のように使いたかったのは、thisバインドなしの方だって
単に短くしたいだけじゃなくて、
値のように使いたかったのは、thisバインドなしの方だって
2018/05/13(日) 01:32:53.99ID:???
jQueryニキ、分かってないくんに続くマジモンだぞ。カッコいい名前募集!
2018/05/13(日) 01:35:34.33ID:???
その子がさ、踏み切りでこっち見て笑ったんだよ。
それもさ、俺のこと好きだと考えたら納得いくんだよな!
天なおチャック開いてた模様
それもさ、俺のこと好きだと考えたら納得いくんだよな!
天なおチャック開いてた模様
2018/05/13(日) 01:43:33.33ID:???
うわっ、そんなこと考えてきたんだw
2018/05/13(日) 01:44:01.24ID:???
話は聞かせてもらった。
人類が滅亡すると考えると納得がいく。
人類が滅亡すると考えると納得がいく。
2018/05/13(日) 01:47:08.48ID:???
妄想納得くん
2018/05/13(日) 02:21:44.42ID:???
てか根拠が俺はこう思うだけでしょ。
お前が思うんならそうかもなくらいしかかけてやれる言葉ないわ。同意求められても困る。
値っぽく考えるの意味もフワッっとし過ぎててよくわからんw
jsの関数はアロー関数以前から第一級オブジェクトとして自由にとりまわせたが。
お前が思うんならそうかもなくらいしかかけてやれる言葉ないわ。同意求められても困る。
値っぽく考えるの意味もフワッっとし過ぎててよくわからんw
jsの関数はアロー関数以前から第一級オブジェクトとして自由にとりまわせたが。
2018/05/13(日) 09:05:44.99ID:???
アプリはやらずWebサイトのみを製作しているんですけど、レスポンシブサイトを作るのにReactって向いていますか?
2018/05/13(日) 09:22:04.49ID:???
>>482
レスポンシブサイトを作るという理由でReactを選ぶ人はあまり聞いたことがないかも
(どちらかというとSPAを作りたいと理由が多いかなーと個人的には思う)
メディアクエリーを勉強した方が近道な気がするよ
レスポンシブサイトを作るという理由でReactを選ぶ人はあまり聞いたことがないかも
(どちらかというとSPAを作りたいと理由が多いかなーと個人的には思う)
メディアクエリーを勉強した方が近道な気がするよ
2018/05/13(日) 10:00:42.63ID:???
やっぱりそうなんですね
オブジェクト指向に則って制作するときに相性がよいと聞いたのですが、サイトや書籍を見ると対象がアプリ開発のものばかりだったので…
メディアクエリっていうのは、ブラウザの幅を取得して処理を出し分けるといったことを指しているのでしょうか
オブジェクト指向に則って制作するときに相性がよいと聞いたのですが、サイトや書籍を見ると対象がアプリ開発のものばかりだったので…
メディアクエリっていうのは、ブラウザの幅を取得して処理を出し分けるといったことを指しているのでしょうか
485460
2018/05/13(日) 10:31:31.57ID:??? アドバイスありがとうございました
IDにはプリフィックスを付けて
まず衝突しないようにすることにします
IDにはプリフィックスを付けて
まず衝突しないようにすることにします
2018/05/13(日) 11:54:53.51ID:???
BEのコメントを読んでるとbindしない方を採用しなかったのは
似たのを2ついれても煩雑になるから
つまりバランスの問題が大きかったんだと思うよ
2014~15年くらいのESDiscasでも何回か挙がってたと記憶してるが
そういう結論になってたと思う
似たのを2ついれても煩雑になるから
つまりバランスの問題が大きかったんだと思うよ
2014~15年くらいのESDiscasでも何回か挙がってたと記憶してるが
そういう結論になってたと思う
2018/05/13(日) 16:25:25.31ID:???
いいえ、関数を値のように見せて使うためです。
当たり前すぎて議論すらされていないので残っていないのです。
当たり前すぎて議論すらされていないので残っていないのです。
2018/05/13(日) 19:21:42.98ID:???
1回目.toDataURLでcanvasから画像データ取り出すことに成功しましたが
2回目以降
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
でエラーでてしまうのですがどうにかなりませんか
function hoge(){ /* .toDataURLを取得するまでの処理 */ }
hoge(); // 1回目のhoge()内ならループなどで何度.toDataURLしても取得できる
hoge(); // なぜか2回目からは最初の.toDataURLでエラーでる
みたいな感じです
(クロスドメインの画像です)
あと疑問なのは、クロスドメインが問題ならなぜ最初は取得できたのか・・?というところです
2回目以降
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
でエラーでてしまうのですがどうにかなりませんか
function hoge(){ /* .toDataURLを取得するまでの処理 */ }
hoge(); // 1回目のhoge()内ならループなどで何度.toDataURLしても取得できる
hoge(); // なぜか2回目からは最初の.toDataURLでエラーでる
みたいな感じです
(クロスドメインの画像です)
あと疑問なのは、クロスドメインが問題ならなぜ最初は取得できたのか・・?というところです
489488
2018/05/13(日) 20:18:15.22ID:???2018/05/13(日) 22:22:59.10ID:???
2018/05/13(日) 23:09:18.75ID:???
canvasから画像データ取り出すと、
たいてい、安全ではないとか言われる
たいてい、安全ではないとか言われる
2018/05/14(月) 06:18:24.34ID:???
別ドメインの画像を貼り付けたりすると
以後そのCanvasは汚染されてるものとみなされてデータの取得が禁止される
以後そのCanvasは汚染されてるものとみなされてデータの取得が禁止される
2018/05/14(月) 08:11:26.62ID:???
その理屈だと別ドメインのJavaScriptを読み込んだら
HTMLは汚染されてるってことになるのか?
HTMLは汚染されてるってことになるのか?
2018/05/14(月) 09:01:22.32ID:???
>>493
その理屈を満たすにはcanvasでjsファイルを読み込む必要があるわけだが、やりかたを是非教えてくれ
その理屈を満たすにはcanvasでjsファイルを読み込む必要があるわけだが、やりかたを是非教えてくれ
2018/05/14(月) 11:57:11.87ID:???
入力中の文字列の中に、前もって登録していたキーワードがあったら、
自動的にリンクになるような機能を実装しようと思います
どうやれはいいですか?
自動的にリンクになるような機能を実装しようと思います
どうやれはいいですか?
2018/05/14(月) 12:49:50.33ID:???
onchangeでvalueに正規表現でmatchかける
2018/05/14(月) 13:02:25.61ID:???
inputやtextareaの中で、リンク、させんのか?
2018/05/14(月) 13:10:04.64ID:???
なにがしたいのかよくわからんな
入力中ってことはtextareaとかなんだろうが、リンクってことは違うよね
あと、リンクにした後で変更する時はどうしたいのか
そのtextarea内にaタグがあっていいのかどうか
>>496
「入力中」だから違うね
onchangeはフォーカスが外れた時に発火する
入力中ってことはtextareaとかなんだろうが、リンクってことは違うよね
あと、リンクにした後で変更する時はどうしたいのか
そのtextarea内にaタグがあっていいのかどうか
>>496
「入力中」だから違うね
onchangeはフォーカスが外れた時に発火する
2018/05/14(月) 13:14:18.20ID:???
リンクさせないといけないので、textareaじゃないです
google documentみたいな、まぁそこまではいきませんが、
リンクだけはリッチテキストでやるみたいな感じです
google documentみたいな、まぁそこまではいきませんが、
リンクだけはリッチテキストでやるみたいな感じです
2018/05/14(月) 13:48:13.66ID:???
前提が明らかでなくて構造が入り組んでるなら自分で考えてくれしかないじゃん
2018/05/14(月) 14:13:18.73ID:???
ロケットみたいに人が乗れて宇宙に行ける乗り物を作ろうと思います。
どうやれはいいですか?
どうやれはいいですか?
2018/05/14(月) 14:36:11.70ID:???
東大阪の町工場に聞いてくれ
2018/05/14(月) 15:34:26.40ID:???
入り組んでませんよ
ただリンクするだけです
ただかなり前に同じようなことをやった時には、
contenteditableな要素のHTMLを、単純に置換して置き換えるだけだと、
カーソルの位置がリセットされてしまった記憶があります
それで
A cross-browser JavaScript range and selection library.
https://github.com/timdown/rangy
これを使って実装したのです
ただ、どういう実装だったのかすっかり忘れてしまいましたし、
このライブラリも2015年で更新が止まっているので、
今なら今のやり方があるんじゃないかと思ったのです
ただリンクするだけです
ただかなり前に同じようなことをやった時には、
contenteditableな要素のHTMLを、単純に置換して置き換えるだけだと、
カーソルの位置がリセットされてしまった記憶があります
それで
A cross-browser JavaScript range and selection library.
https://github.com/timdown/rangy
これを使って実装したのです
ただ、どういう実装だったのかすっかり忘れてしまいましたし、
このライブラリも2015年で更新が止まっているので、
今なら今のやり方があるんじゃないかと思ったのです
2018/05/14(月) 15:59:53.89ID:???
designModeは知ってたけどcontenteditableは知らなかったな
質問の実質はキャレット操作でしょ
キャレット位置は単純にかつ地道にカウントして記憶して戻すしかないでしょ
質問の実質はキャレット操作でしょ
キャレット位置は単純にかつ地道にカウントして記憶して戻すしかないでしょ
2018/05/14(月) 16:39:31.52ID:???
contenteditableのキャレット操作と
inputやtextareaのキャレット操作と、なんか違いがあるの?
inputやtextareaのキャレット操作と、なんか違いがあるの?
2018/05/14(月) 17:06:15.65ID:???
キャレットの位置はこないだも質問が出て大ゲンカになってなかった?
2018/05/14(月) 18:07:17.98ID:???
便乗で質問します
キャレット無しの場合、本来TEXTAREAやINPUTにキーボード入力するような操作を
DIV要素でやるにはどのような構成になるのでしょうか(googleドキュメントみたいなやつです)
TEXTAREAにキーボード入力したものをval()で取得してDIVにコピー、みたいなのではありません
さらに全角半角や漢字など(TEXTAREAへ入力できるものすべて)も判別したいです
keydown取得してkeyCodeで半角全角を振り分け→漢字などはスペースキーの監視で。
全角時にはバックスペースキー、半角切り替えも監視
など考えましたがそんなめんどくさい処理をしないといけないのか・・?と眉唾でした
(そのためのTEXTAREAやINPUTだと思いましたが)
例えばGoogleドキュメントなどはそういうめんどくさいキー監視をしているのでしょうか?
キャレット無しの場合、本来TEXTAREAやINPUTにキーボード入力するような操作を
DIV要素でやるにはどのような構成になるのでしょうか(googleドキュメントみたいなやつです)
TEXTAREAにキーボード入力したものをval()で取得してDIVにコピー、みたいなのではありません
さらに全角半角や漢字など(TEXTAREAへ入力できるものすべて)も判別したいです
keydown取得してkeyCodeで半角全角を振り分け→漢字などはスペースキーの監視で。
全角時にはバックスペースキー、半角切り替えも監視
など考えましたがそんなめんどくさい処理をしないといけないのか・・?と眉唾でした
(そのためのTEXTAREAやINPUTだと思いましたが)
例えばGoogleドキュメントなどはそういうめんどくさいキー監視をしているのでしょうか?
2018/05/14(月) 18:09:37.94ID:???
キー監視じゃIMEがどんな変換したかわからないから面倒如何の前に不可能でね
2018/05/14(月) 18:20:37.28ID:???
例えばhiddenしたTEXTAREAにフォーカスを当てて・・
みたいなことができればと、hiddenしたtextareaにfocusしてみましたが
TEXTAREA内の変更にまでは至りませんでした
>>508
たしかに・・
みたいなことができればと、hiddenしたtextareaにfocusしてみましたが
TEXTAREA内の変更にまでは至りませんでした
>>508
たしかに・・
2018/05/14(月) 18:23:42.47ID:???
textareaは表示のまま、potitionでwindowから見切れるように
ならできました
ただ、キーボード入力のプルダウンメニューが邪魔になりますが
ならできました
ただ、キーボード入力のプルダウンメニューが邪魔になりますが
2018/05/14(月) 18:57:37.63ID:???
ちなみに稚拙ですがこんな感じです
https://jsfiddle.net/5sgn8d8e/
https://jsfiddle.net/5sgn8d8e/
2018/05/15(火) 00:57:32.59ID:???
たしかにキャレット位置を保存しておいて、HTMLを書き換えてから戻す
みたいな処理だった気がします
で、すごーーく面倒くさかった記憶があります
RangeオブジェクトとかSelectionオブジェクトとか、
普段全く使わないようなオブジェクトを使って・・
しかもそれらのオブジェクトが異様に難解だった記憶があります
今もそれですかね〜
みたいな処理だった気がします
で、すごーーく面倒くさかった記憶があります
RangeオブジェクトとかSelectionオブジェクトとか、
普段全く使わないようなオブジェクトを使って・・
しかもそれらのオブジェクトが異様に難解だった記憶があります
今もそれですかね〜
2018/05/15(火) 01:28:59.58ID:???
2018/05/15(火) 03:08:21.53ID:???
一定の領域では泥臭い作業から逃げられん
論理的に必要なことはどうした考えても何度考えても必要
論理的に必要なことはどうした考えても何度考えても必要
2018/05/15(火) 05:57:19.24ID:???
2018/05/15(火) 06:31:26.60ID:???
IME API使えばいいじゃん
対応環境無いけど
対応環境無いけど
2018/05/15(火) 06:50:37.39ID:???
div要素の内容が変更されたら、しかしそもそもdiv要素にどうやってキーボードから書き込むの、っていう話じゃないの>>515
隠しtextarea法が定石なの?
隠しtextarea法が定石なの?
2018/05/15(火) 07:05:39.60ID:???
定石なんて無い
それでバリアがある環境や、ガラケーみたいなテキスト編集環境に対応できるかは分からんし
一般論としてできる限り細かい調整はしないで諦めたほうが良い
それでバリアがある環境や、ガラケーみたいなテキスト編集環境に対応できるかは分からんし
一般論としてできる限り細かい調整はしないで諦めたほうが良い
520515
2018/05/15(火) 07:12:36.31ID:??? Electron アプリの、VS Code では、半角文字で入力補完が出る
Electron とか使わないと無理なのかも
Electron とか使わないと無理なのかも
2018/05/15(火) 08:01:56.32ID:???
>>517
div要素を編集可能にするだけじゃん
div要素を編集可能にするだけじゃん
2018/05/15(火) 16:04:21.29ID:???
ぐぐったらcaret.jsというのがあるみたいだけど
https://jsfiddle.net/sbrqvc2q/
https://jsfiddle.net/sbrqvc2q/
2018/05/16(水) 06:07:00.35ID:???
そういうのあるんですね
ありがとうございます
ただ要素中のHTMLを書き換えてキャレットを戻せばいいと思っていましたが
よく考えると文字を一文字書き加えるごとに全領域を書き換えるエディタなんてないわけで
テキストノードの中に潜って文字のレベルで操作する必要があると思います
そのためのオブジェクトがRangeオブジェクトだったと思います
面倒くさいですが、面倒くさい方法しかないなら、するしか仕方ないですね・・
ありがとうございます
ただ要素中のHTMLを書き換えてキャレットを戻せばいいと思っていましたが
よく考えると文字を一文字書き加えるごとに全領域を書き換えるエディタなんてないわけで
テキストノードの中に潜って文字のレベルで操作する必要があると思います
そのためのオブジェクトがRangeオブジェクトだったと思います
面倒くさいですが、面倒くさい方法しかないなら、するしか仕方ないですね・・
2018/05/16(水) 08:26:59.14ID:???
改行ごとにspanやpで区切るなどして部分的な指定をしやすくすれば、
HTMLの書き換えでもいいのかもしれません
ただ、何か問題があったから前回そうしなかったのではないか、という気もします
HTMLの書き換えでもいいのかもしれません
ただ、何か問題があったから前回そうしなかったのではないか、という気もします
2018/05/16(水) 11:43:04.01ID:???
SelectionオブジェクトとRangeオブジェクトには、
ひととおりの API が定義されていますが、あまり使われていません。
本書でも解説しません。
(…)
Webアプリケーション上でリッチテキスト編集機能が必要な場合は、
ブラウザ間での差異を吸収してくれる既存のソリューションを適用するとよいでしょう。
インターネット上を探せば、そのようなエディタ部品がたくさん転がっています。
名著と名高いサイ本も、リッチテキスト編集周辺はそっけない記述&放り投げです
「たくさん転がっています」って、
これはそういうエディタ部品を作りたい人が読む本じゃないのかと問い詰めたいです
ひととおりの API が定義されていますが、あまり使われていません。
本書でも解説しません。
(…)
Webアプリケーション上でリッチテキスト編集機能が必要な場合は、
ブラウザ間での差異を吸収してくれる既存のソリューションを適用するとよいでしょう。
インターネット上を探せば、そのようなエディタ部品がたくさん転がっています。
名著と名高いサイ本も、リッチテキスト編集周辺はそっけない記述&放り投げです
「たくさん転がっています」って、
これはそういうエディタ部品を作りたい人が読む本じゃないのかと問い詰めたいです
2018/05/16(水) 12:06:09.71ID:???
>>525
テキストエディタの作り方って本があると思ってんの?
テキストエディタの作り方って本があると思ってんの?
527Name_Not_Found
2018/05/16(水) 12:12:00.56ID:nGgdPMwx 配列について質問です
var arr = [1, 2, 3, …]; と続く配列をタグで囲み、IDを割りふるにはどうすればいいでしょうか?
<b id="1">1</b> <b id="2">2</b> <b id="3">3</b> … のようにしたいです
下を試しましたが、IDにすべての配列が入ってしまったため、arr[0] と arr[1] としたら、3番目以降が2のままでした
console.log('<b id="' + arr + '">' + arr.join('</b> <b id="' + arr + '">') + '</b>');
よろしくおねがいします。
var arr = [1, 2, 3, …]; と続く配列をタグで囲み、IDを割りふるにはどうすればいいでしょうか?
<b id="1">1</b> <b id="2">2</b> <b id="3">3</b> … のようにしたいです
下を試しましたが、IDにすべての配列が入ってしまったため、arr[0] と arr[1] としたら、3番目以降が2のままでした
console.log('<b id="' + arr + '">' + arr.join('</b> <b id="' + arr + '">') + '</b>');
よろしくおねがいします。
2018/05/16(水) 13:56:16.68ID:???
>あまり使われていません。
ガリガリ使っとるがな
ガリガリ使っとるがな
2018/05/16(水) 17:09:18.55ID:???
>>527
var ary = [1, 2, 3, 4];
console.log(ary.reduce((acc, n) => acc + `<b id="${n}">${n}</b>`, ''));
var ary = [1, 2, 3, 4];
console.log(ary.reduce((acc, n) => acc + `<b id="${n}">${n}</b>`, ''));
2018/05/16(水) 17:13:13.29ID:???
>>529
ありがとうございました!
ありがとうございました!
2018/05/16(水) 19:24:22.87ID:???
>>529
console.log(ary.reduce((acc, n) => acc + `<b id="${n}">${n}</b>`, ''));
console.log(ary.map(n => `<b id="${n}">${n}</b>`).join(''));
上の方を選んだ理由は?
console.log(ary.reduce((acc, n) => acc + `<b id="${n}">${n}</b>`, ''));
console.log(ary.map(n => `<b id="${n}">${n}</b>`).join(''));
上の方を選んだ理由は?
2018/05/16(水) 19:37:19.81ID:???
どっちでもいいけど新しい配列ちゃん生んですぐ殺すとかかわいそうやん
2018/05/16(水) 21:46:41.00ID:???
そんな無理にmapだのコールバックだの使わなくとも
昔っからある
(''+ary).replace(/(\d+),?/g,'<b id="$1">$1</b>')
でいいじゃん
昔っからある
(''+ary).replace(/(\d+),?/g,'<b id="$1">$1</b>')
でいいじゃん
2018/05/16(水) 22:03:54.34ID:???
ループさせますが何か
2018/05/16(水) 23:57:30.03ID:???
2018/05/17(木) 00:38:42.11ID:???
中途半端に新作作るならいっそリメイクの方が売れると思う
2018/05/17(木) 00:42:57.16ID:???
jsは昔っからコールバック使うが。
そういう言語だ。
pythonとかから来た人かな?
そういう言語だ。
pythonとかから来た人かな?
2018/05/17(木) 00:59:32.71ID:???
あ?昔から? JavaScriptでmapやreduceが
使えるようになったのはIE9からなんだが?
昔はそんなコード書いてねーよ
使えるようになったのはIE9からなんだが?
昔はそんなコード書いてねーよ
2018/05/17(木) 01:40:37.68ID:???
IEをサポート対象外としてきたものは幸福である
2018/05/17(木) 01:52:20.30ID:???
IE以外はネスケしかないって時代を知らんのだろうなw
それでよく昔からなんて言えたものだ
それでよく昔からなんて言えたものだ
2018/05/17(木) 02:11:05.39ID:???
2018/05/17(木) 03:14:54.20ID:???
昔から使うsetTimeoutもcallbackだな
callbackが昔から使われていることと、replace()が昔からあることは別だが
callbackで配列や文字列操作する関数って昔からあったっけ?
callbackが昔から使われていることと、replace()が昔からあることは別だが
callbackで配列や文字列操作する関数って昔からあったっけ?
2018/05/17(木) 06:21:36.32ID:???
>>535
そんなんだから君には成長がないんだよ
そんなんだから君には成長がないんだよ
2018/05/17(木) 06:29:42.28ID:???
はぁ?去年から10kgは成長しとるで?
2018/05/17(木) 07:30:57.08ID:???
もう成長する毛髪もないクセに・・・
■ このスレッドは過去ログ倉庫に格納されています
ニュース
- 上野動物園の双子パンダ、1月末に中国に返還へ 国内でパンダ不在に [蚤の市★]
- 中国軍機のレーダー照射1週間 駆け引き続く 中国、米のレッドライン模索 日本、米以外の同志国とも連携探る 米は対立から距離置く★2 [ぐれ★]
- ゼレンスキー氏、NATO加盟断念に言及 ドイツで米代表団と [蚤の市★]
- 【芸能】粗品、日本テレビに苦言 客のレベルが「かなり低い。あいつら分かってない」「拍手したいだけやねん」 [冬月記者★]
- 橋下徹氏「総理なら岡田さんに何を聴かれても耐えてほしかった」 高市首相の台湾有事めぐる答弁に# [jinjin★]
- 【静岡】伊東市長選、前市議の杉本氏初当選 学歴詐称疑惑の田久保氏は及ばず 市長選3700万円、市議選6300万円の計1億円費やされる [ぐれ★]
- (財務)片山さつき『サナエノミクス💕』開始。「所得、経済、税収全てが上がる夢のような政策」 [153490809]
- リコリコとかいうアニメ、ヒョロガリJKがムキムキのおっさんボコってて萎えて1話切り
- スモークチーズって食べ始めたらやめられない止まらないになるんだが
- 窓口で「いったん10割負担」の件数が1年で2倍近くに増加。「マイナ保険証」スマホマイナも登場で医療現場「もう無理」 [256556981]
- フィンランド人による吊り目でアジア人差別事件、日に日に炎上が大きくなっていく [279254606]
- 新幹線で越後湯沢に向かってるの(´・ω・`)
