読者です 読者をやめる 読者になる 読者になる

uzullaがブログ

uzullaがブログです。

jqueryでifとか使いTai!

$(elm)
 .if( (hoge==1), $(this).prop('mark',1) )
 .addClass('hage')
 .if(($(elm).hasClass('guge'), $(this).removeClass('guge') )

こんなコードカキタイナーってつぶやいたら、udzuraさんから
http://0-9.sakura.ne.jp/pub/lt/browserws/jquery.tap.html
をおしえてもらって、

こんなコードができた

$.fn.if = function (flag, func) {
    if(flag && $.isFunction(func)){
        func.call(this, this)
    }
    return this;
}


これはこんなふうに書ける

$('body')
   .if(1, function(){$(this).css('background-color','red')})
   .if(0, function(){$(this).css('background-color','blue')})
   .if(1, function(){$(this).css('background-color','green')})

大体望み通りの事ができる!!


うーん、function(){}って毎回かかなきゃいけないのがウザいなー。
最初みたいな書き方したいなー(eval的な方法以外のやり方が思い浮かばない…)

追記

ふむ、CoffeeScriptなら、まあ見れない事もないな。

$('<span />')
  .prop('src_id',src.id)
  .if(src.pin==1, ()-> $(this).addClass('check').text('レ') )
  .if(src.pin==0, ()-> $(this).addClass('nocheck').text(' ') )

うーん、

.if(
  src.pin==1,
  ()-> $(this).addClass('check').text('レ'),
  ()-> $(this).addClass('nocheck').text(' ') )

ってelseまでかけるのがいいかなあ?
でも一行長くなるし(上は改行してあるけど)、じゃあelseif実装するの?って感じになるし、まあif羅列でいいかなあ。

追記

追記する事でもないけど、Gist

追記

iPhone の Mobile Safariだとエラー扱いになっちゃいますね(Webkitだと普通に動くんだけどな)
ついでに、結局else動作をサポートしたものが以下になります。

$.fn.ift = function(){
    var flag = arguments[0];
    var func = arguments[1];
    var else_func = arguments[2];

    if(flag && $.isFunction(func)){
        func.call(this, this);
    }else if(!flag && $.isFunction(else_func)){
        else_func.call(this, this);
    }
    return this;
}