ReactのWarningをなんとかしたいっ！
Warningが気になったので修正していきます。 Warning: A component is changing a controlled input of type text to be uncontrolled. Input elements should not switch from co…
JavaScript
DOMに外部cssで適用されてるstyleが取りたいっ！
タイトルの通りですが、以下のようなhtmlがあった時に <div class="list" id="main_list"> <p>hogehoge</p> </div> このdivのstyleが取りたい時に、 c…
BootstrapのModalで勝手にスクロールしないようにしたいっ！
Bootstrapで謎の挙動（バグ？）があったのでメモ。 現象 スマホサイズでModalを起動した時に、裏側（Modalを起動した側）のスクロールがTOP(一番上）にきてるぽい？ つまり、ページの下の方にモーダルを起動するボタンがあると、モーダル起動して、モーダルを閉じると、なぜかページTOPになっ…
Reactのonclickに引数を渡したいっ！
普通に引数が無い場合は、 clicked() { console.log('click!!'); } render () { <div> <a onClick={clicked}>リンク</a> </div> } これで、クリックした時にclicked…
GoogleMapAPI緯度経度が範囲を超える問題
GoogleMapで緯度経度を取得した時に、有効範囲外の数値が取得される場合があるようなので、その対処方をメモ。 緯度経度の範囲 緯度(latitude)の範囲は、-90° ~ 90° 経度(longitude)の範囲は、-180° ~ 180° なので、これを超える事は無いはずなんですが、Goog…
input type=”file”で複数選択した画像をアップロード前にプレビュー表示(jQuery)(html5)
multipleを使わない(1つだけ)であれば、input type=”file”で画像アップロード前にプレビュー表示(jQuery)の方法で、プレビューが可能ですが、multipleを指定した場合に、複数画像をプレビュー表示する必要があったのでメモ。 複数選択できるhtmlを用意 用意するhtml…
Javascriptで連想配列(Object)の要素数を取得する方法。
直感的にやろうとすると・・ 普通に.lengthじゃろ？と思って var test = {'a':1,'b':2,'c':3}; var len = test.length; console.log(len); // undefined んー・・undefined。 正解は、Object.keys …
jsxでコメントアウト
前に作ったMessageクラスですが、、 var Message = React.createClass({ render: function() { return ( <div className="message"> <h2 className="…
react.jsで別のComponentへのアクセス
htmlは以前用意したもの(Hello, React.js!! まずは何か表示してみる。)をそのままで。 var Message = React.createClass({ render: function() { return ( <div className="message&q…
React.jsでコンソールに”Download the React DevTools for a better development experience”って出るやつ。
Chromeのconsoleに出てるんですが、これ出っ放しなんかな・・？と思ったんですが、、 Download the React DevTools for a better development experience: http://fb.me/react-devtools そもそも読み込んでた…
jsxでwatchの拡張子を指定する
jsx --watch react static/dest って感じでコンパイルしようとすると、react以下の*.jsしか見てくれないんですが、 jsx --watch react static/dest -x jsx って感じで"-x"をつけてやると、*.jsxが対象になる。 そもそも、"--w…
Hello, React.js!! まずは何か表示してみる。
用意したhtmlは以下。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <title>Hello, React.js</title> <sc…
React.js事始め。react-toolsをインストールしてみた。
jsxで書いてjsにコンパイルするのが一般的？なようなので、まずはjsxのコンパイル環境を作りたいと思います。 node.js + npmはすでにインストール済み。 やり方的には、(CentOS6.3にnode.js(v0.10.0)をインストールしてみる。)この辺りと変わってないと思います。 では…
javascriptで前のページに戻れないようにする(history.back無効化)
javascriptが無効なブラウザだと当然効かないんですが、jQueryを読み込みつつ、戻られたくないページで下記のjsを埋めれば簡易的な無効化が可能ぽいです。 $(function(){ window.onunload = function() {}; history.forward(); })…
jQueryUIのDatepickerで複数の日付を選択する(簡易版)
タイトルには簡易版って書きましたけど、どっちかといえば安易版？ｗ ユーザー側で使うのは重いんで、管理画面とかならまぁ使ってもいいかなーくらいの感じです。 まずはhtmlから。 <head> <link rel="stylesheet" href="//…