monacaでcordovaプラグインを使って音声入力をする

必要なプラグイン

https://github.com/macdonst/SpeechRecognitionPlugin

必要なプラン gold以上

inputフィールドに、音声でテキストを入れたい。
キーボードのマイクボタンでは小さくて押しづらいという話があったので、cordovaプラグインを使って実装。

function voicesearch(){      

    var micOptions = {
          language : "ja-JP",
          matches : 1,
        }
        window.plugins.speechRecognition.startListening( micSuccess,  micError,  micOptions);      
}
   
   
    function micSuccess(result){
        $("#searchword").val(result) ;//jquery使ってます
        search();
    }
   
    function micError(result) {
        //alert("error : " + result) ;
    }


html

<input type="search" id="searchword">
<ons-button onclick="voicesearch()" >音声入力</ons-button>

海外ダウンロードサイトが快適になるブックマークレット

キャプチャーを入れようとしたらポップアップが開いたり、マウスカーソルを置いただけで、広告が出たりする人へ。
↓コピペして、ブックマークのURLの部分に貼って、画面が表示されたら押すだけです。

javascript:(function(){$(function(){$("*").off();$("body a[target='_blank']").remove();$("form").each(function(){$(this).get(0).onsubmit = "" ;});$("input").focus();});})();

【jQuery】【javascript】料金表カレンダーを楽に入力できるフォーム（案）

世の中にはまだまだアナログ作業が残っているようで、
旅行のパンフレットとかによくある料金表の原稿づくりとかも、FAXで手書きのものが送られてきたりする（らしい）。
そこを何とかフォーム入力でお願いしますという話がでて、原案として出したのがこんなもの。
jQueryのdatepickerじゃ上手くいかなそうだったので、tableで作ってみた。
手書きよりは、楽だと思うんだけど。
「続きを読む」で動きます。

日	月	火	水	木	金	土
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31

日	月	火	水	木	金	土
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28

【jquery】【javascript】jqueryで割り当てられたイベントハンドラを取得する

chromeならデベロッパーツールを開いて、コンソールに
$._data($("#id").get(0), "events");
と入力する。

【jquery】【javascript】slider同士の値を比較すると挙動がおかしかった

sliderの値を比較しようとしたとき。
<input id="slider1" type="range" min="0" max="100" step="1" value=100 />
<input id="slider2" type="range" min="0" max="100" step="1" value=20 />

slider1value = $("#slider1").val();
slider2value = $("#slider2").val();

if(slider1value >= slider2value)
{
 alert("slider1はslider2以上である");//こちらを期待
}else
{
 alert("slider1はslider2未満である");//こちらが出てくる
}

理由は、val()は文字列で返されるのを忘れていたから。
alert(typeof slider1value);//string

つまり、
alert("20">"100");//true
これと同じことをしてた。

rangeスライダーだからってわけじゃないけど、頭から消えていました。

こうすると、うまくいく
slider1value = $("#slider1").val()-0;
slider2value = $("#slider2").val()-0;

【javascript】【jquery】スライダーの値を特定の箇所で吸着したい

例えば2-1024までの値のスライダーで、選べる値は2のn乗のみとしたい。
つまり、選べる値は2,4,8,16,32,64,128,256,512,1024とする。

<div class="ui-field-contain" id = "sliderdiv">
   <label for="slider">値</label>
   <input id="slider"  type="range" min="2" max="1024" step="1" value=2/>
</div>
<script>
    var keys = [2,4,8,16,32,64,128,256,512,1024];
    var keys_length =keys.length;
$(function(){
   $("#sliderdiv").on("change", "#slider", function() {
      var tmpvalue = $("#slider").val();
      for(var n=0;n<keys_length;n++)
      {
         if(tmpvalue<=keys[n])
         {
            break;
         }
      }
      if((keys[n]+keys[n+1])/2<tmpvalue)
      {
         $("#slider").val(keys[n+1]);
      }
      else {
         $("#slider").val(keys[n]);
      }
      if($("#slider").val()!=tmpvalue)//これ書いておかないと無限に処理を繰り返してしまう
      {
         $("#slider").slider('refresh');
      }
   })
})
</script>

【javascript】【jquery】スライダーの値によって、buttonを無効（disable）にする

よし、やる気ボタンを押すと仕事をやる気を出すぞ。
でも、暑かったり寒かったりしたらやる気ボタンが表示されないぞ。しょうがない。
という仕組み。
sliderって単純に$("#slider").on("change",function(){...})
じゃ処理は起動しないのね

<div class="ui-field-contain" id = "sliderdiv">       <label for="slider">気温</label>
    <input id="slider"  type="range" min="0" max="100" step="1" value=0 />
</div>
<button id ="yaruki">
やる気ボタン
</button>

<script>
$(function(){
    $("#sliderdiv").on("change", "#slider", function() {
    //または、$("input#slider").live("change", function() {
        var slider_value = $("#slider").val();
        if(15<=slider_value&&slider_value<=25)
        {
            $('#yaruki').prop('disabled', false);//非表示をオフにする。つまり、表示。
        }else{
            $('#yaruki').prop('disabled', true);
        }
    })
})
</script>

tablefixプラグインを使っていると、他のtable系プラグインを使うのは難しいかもしれない

古いサイトの改修で、テーブルをソートする機能をつけようとしたときのこと。
適当なjqueryを見繕って、実装すればOKだなーと思ったら、やけにはまった。
よくよくソースを見ると、
tablefix
http://www.otchy.net/javascript/tablefix/
というプラグインでテーブルを整形していた。ソースを読むと、元のテーブルを分割処理している・・・。

tablefix1というテーブルが４つ作られている↓

これじゃ、ソートできないわけだ。
よし、あきらめた！
正式に依頼があったら、tablefixのほうを変えてなんとかしよう。

動的に作成したhtml部分にjquery/jquery mobileのスタイルが適用されない

#動的部分にinnerhtmlを代入するとして
$("#動的部分").html(innnerhtml)
の後ろに.trigger('create');を追加して
$("#動的部分").html(innnerhtml).trigger('create');
とする。