自分用めも

初心者ちっくなプログラムネタを中心に、自分用の覚え書きをメモっていくための場所です。

HTML5

Vueでtextareaの高さを自動調整する

"vue": "^2.6.14" <template> <textarea v-model.trim="desc" :rows="descCount" style="resize: none;" required /> </template> <script> computed: { descCount() { return (this.desc.match(/[\r\n]/g) || []).length + 1 }, }, </script> resizeableにしてユーザー操作で高さ調整すると、 rowsのbindが解除されてしまう(改行しても自動リサイズされ</textarea></template>…

CSSのhoverの書式

昔作ったページをメンテしていてはまったこと。 <html lang="ja"> <head> <style> .test1 { width: 30em; height: 2em; background-color: black; color: white; } .test1: hover { background-color: yellow; color: red; } .test2 { width: 30em; height: 2em; background-color: black</head></html>…

jQueryでhtmlフォームの内容を初期化する

<input type="reset">をjQueryから呼び出す。 jQueryオブジェクトの[0]が、DOMエレメントです。 getElementByIdとかで書いてもおk。 $('#form_id')[0].reset(); 「クリア」ではなく「初期化」な事に注意。 ページレンダリング時点のvalue値に戻ります。

localStorageの内容を全部出力する

function showAllStorage() { var values = [], keys = Object.keys(localStorage), i = keys.length; while ( i-- ) { console.log( keys[i] + ': ' + localStorage.getItem(keys[i]) ); } } stackoverflow.comまんま参考にしただけですが めも

submitせずにhtml5のバリデーションを動かす

formオブジェクトのcheckValidityというメソッドを呼ぶことで、バリデーション可能。 エラーがなければtrue、NGの場合はfalseを返却。 ajaxで更新するときの軽いチェックとかに。 素のJavaScriptの場合 if (!document.getElementById('form').checkValidity(…

enchant.jsで入力フォームを作成

var core = new Core(288, 512); core.onload = function() { var input = new Entity(); //DOM設定 input._element = document.createElement('input'); input._element.setAttribute('type','text'); input._element.setAttribute('maxlength','10'); inpu…