ボタンをクリックしてコピーするjqueryの解説 2:アーカイブ:ドラクエ10冒険・サイト運営ブログ


ボタンをクリックしてコピーするjqueryの解説 2
期間 Ne

ボタンをクリックしてコピーするjqueryの解説 2


~~~解説~~~

前回ありましたjqueryの1行目は特に必要なさそうでしたので削除しました。

▶▶$(".copy2").on("click",function(){
Classのcopy2をクリックしたら発火します

▶▶$(this).prev("label").children("input").prop("checked", true);
ボタンをクリックしたらチェックを付けます。
入力したかどうか忘れちゃう私向けの機能ですね。
別scriptでローカルストレージに保存します。
クリックした直前にあるlabelの中のinputという指定ですが、
もう少しうまく書けないものですかね。

▶▶var range = document.createRange();
▶▶range.selectNodeContents( $(this).next("span").get(0) );
選択する要素の設定です。
$(this).next("span").get(0)
つまりクリックした次のspanがその場所ですね
ここら辺はもうだいたい固定の関数でしょう

▶▶var selection = window.getSelection();
▶▶selection.removeAllRanges();
▶▶selection.addRange(range);
選択している部分です。

▶▶document.execCommand("Copy");
コピーする関数です。
固定ですね。

前回との違いは選択を変えてチェックボックスを一方通行で連動させただけですね。
サイトについて
このサイトはドラゴンクエスト10を攻略するに当たって、
なるべく便利な形で情報を発信しようと試みる個人サイトです。
こんなの便利じゃない?こんなのあったら良いな~なご意見は常に募集中です。
まずは私のテクノロジィを試して欲しいんふふ(海外ドラマAPBネタ)
 
このサイトはJavaScriptをふんだんに使用しています。
JavaScriptを無効にしているとかなり機能が制限されます。
当サイトではCookieは使用していませんが、local storageを使用しております。
当サイトのJavaScriptおよびlocal storageで個人情報などの収集は一切していません。
当サイトで表示している広告には表示を最適化するためのcookieを使用しています。
リマーケティングの設定はこちら。
お問い合わせ
メールはこちらへ
info@dq10as.net
そのうち意見交換できるフォーラム作る!作る。作る?
 
画像・動画について
このページでは、株式会社スクウェア・エニックスを代表とする共同著作者が権利を所有する画像・動画を利用しております。
(C)2017 ARMOR PROJECT/BIRD STUDIO/SQUARE ENIX All Rights Reserved.
(C)SUGIYAMA KOBO(P)SUGIYAMA KOBO