[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
息子が和風の物を好む、という話を妻にされた。見ると確かに和風のものを食べている時と洋風のものを食べている時でペースが違う。
しかし、トマトスープを与えたら和食の時とペースが変わらず。そういえば、バナナやパンでも変わらない。
今まで試した洋風の物を見てみると、ドリアやシチューといったものである。そういえば、最近ミルクの飲みがよくない。
もしかして、乳製品が嫌い？
以下のようにすると、上述のような入力欄が作れる。
<input list="my-datalist"
autocomplete="on"
type="text" />
<datalist id="my-datalist">
<option>ひよこ</option>
<option>ひつじ</option>
<option>うさぎ</option>
</datalist>
ユーザの入力に合わせて候補を絞ってくれる便利な奴である。
だがこれ、Safari (iPhone 標準のブラウザ) では datalist が対応していなく、使えないらしい。上手いこと JavaScript とかで作ってやらないといけないようだ。
過去の入力を WebStrogage に保存しておき、それをページ読み込みと同時に datalist に追加することで、過去の入力も含めて候補として出力したかった。入力欄兼コンボボックスみたいな使い方をしたかったのである。
編集可能な要素。例えば、この赤い文字は contenteditable なので編集できるはず。
input じゃない要素を入力欄にしたい時に contenteditable は便利に見える。しかし、こいつ、 change イベントが発火しないのだ。change イベントをトリガーにして何かするのには使えない。
<div id='all'>
<div name='a' contenteditable='true' style='border:3px solid black;'>ひつつん</div>
<div name='b' contenteditable='true' style='border:3px solid black;'>ちわわとちくわ</div>
<div name='c' contenteditable='true' style='border:3px solid black;'>ひよよん</div>
<input name='d' type='text' value='これは特に設定しなくても change イベントが発生する' />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$('#all').change(function(e){alert($(e.target).attr('name'));});
</script>
次の JavaScript を埋め込むことで contenteditable に変更が発生した場合に change イベントを発火させられる。とりあえず手元の Google Chrome と FireFox では問題なく動いた。
function bindContenteditableChangeEvent(){
var $contenteditables = $("[contenteditable='true']");
var text = '';
$contenteditables.on('focus', function(e){
text = $(e.target).html();
});
$contenteditables.on('focusout', function(e){
if(text !== $(e.target).html()){
$(e.target).trigger(new $.Event('change'));
}
});
}
bindContenteditableChangeEvent();息子が下痢になって4日が経ちました。本人は機嫌もよく下痢を除けば体調にも問題なさそうですが、そろそろ肌荒れが激しい……週明けには病院行きます。
下痢による肌荒れには桃の葉ローションとかが効くのかしら……評判良いけど試したことない。
ももの葉ローション(200mL)[あせも 桃の葉ローション ベビーローション] |
Shunshun94/hiyontof を公開しました。全部 JavaScript で動いています。
TRPG 用ツールとして日本国内ではシェアが最も高いと思われるどどんとふ (http://www.dodontof.com/) は多機能なのですが、 Flash を使っているためスマートフォンではアクセスができませんでした。これを解決するために作ったアプリとなっています。