Blogger 自分のアクセスを追跡しない設定を紹介

どうも。どっことです。今回はBloggerで自分のアクセスを追跡しない設定を紹介します。

自分のアクセスを追跡しない

完全に自分自身の備忘録のためだけのページです。参考ページの方、とても助かっています。本当にありがとうございます。

1. 以下をコピーする。日付は適当。

document.cookie = "_ns=2; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";

2. F12をして developer tools を表示する。

3. Consoleタブをクリックする。

4. コピーした文字列を貼り付けて実行する。

まとめ

以上です。

参考

• Blogger 「自分のビューを追跡しない」が機能しない（保存されない）原因と対策

JavaScript HTTP通信で情報取得する実装を紹介

どうも。どっことです。情報取得する処理を紹介します。今回はJavascriptで情報取得する実装方法です。

実装時の紹介

実装は以下の4点です。

1. XMLHttpRequestオブジェクトを作る
2. 取得URLやメソッドを設定する
3. 取得した時の制御をコールバックとして実装する
4. 通信開始メソッドをコールする

上記を踏まえサンプルを載せます。

// 1.XMLHttpRequestの生成
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
　　　　// 3.取得した時の制御
    if (xhr.readyState == 4) {
    　　　　// 取得成功
    }
};
// 2.取得URL・メソッドの設定
xhr.open("GET", "http://www.example.org/example.txt");
// 4.通信開始メソッドをコール
xhr.send();

この辺は、ネイティブアブリを作るのと同じ感覚ですね。

参考

• XMLHttpRequest の使用

HTML/CSS/JavaScript モーダル(ポップアップ)表示したい

ボタンをタップしたらポップアップを表示させたいので実装方法を調べた。

やったこと

モーダル表示用のdivをbodyタグにいれる＋不要になったら捨てる。

<div id="modal-view" class="modal-background">
  <div class="modal"/>
</div>

• modal-backgroundクラスは背景として設定。
• modalクラスをポップアップぽくCSSを設定する。
• 背景、ポップアップは参考サイトの設定を見てなんとなく。

不要になったら以下で捨てる。

var view = document.getElementById('modal-view');
document.body.removeChild(view);

JavaScript ユーザに画像を選択させる

ユーザにローカルの画像を選択させてWebページ上に反映させたかったので調べた。

画像を選択させるための導線

<input type="file" id="myImage" accept="image/*">
<img id="preview">

• input タグを使う。
• type はfile を指定する。
• acceptというattributeがあるから、それにimageを設定する。

ユーザが選択した画像を画面に反映する

$('#myImage').on('change', function (e) {
  var reader = new FileReader();
  reader.onload = function (e) {
    $("#preview").attr('src', e.target.result);  
  }
  reader.readAsDataURL(e.target.files[0]); 
});

• inputに対して、ユーザが何かしら選択したことを検知するリスナーを付与
• FileReaderで読み込んで、読み込んだ画像をsourceとしてimageタグに付与
• jqueryで書かれてるぽい

参考

• 【JavaScript】input[type=”file”]で選択した画像をimg要素で表示する