10月 2009のアーカイブ
作ってみたよー!! ランダムバナーを表示する jQuery プラグイン
「ランダムにバナーを表示したい」という要望があり、データベースとか使うような大袈裟なものじゃないもの…と jQuery でなんとか実現できないものかと、ちょっと自分で作ってみる事にしました。
サンプルを設置しました！ → SAMPLE
ソースコードは以下。
(function($){
$.fn.rb_collection = {};
$.fn.rb_collection = function(cfg) {
var that = this;
if($.browser.msie && !$.fn.random_banner.winloaded)
$(window).load(function(){ ini(cfg) });
else
ini(cfg);
function ini(cfg) {
$.post( cfg, function(data, status) {
var $items = $(".rb_collection", data);
var arr = $.makeArray($items);
var nums = Math.floor(Math.random() * arr.length);
$(that).html(arr[nums]);
}, "html");
};
};
})(jQuery);
使い方は、jQuery(1.3.2 で動作してました!) と一緒に読み込み…。
以下のように、HTML を書きます。
該当するのは、
$("#bp_holder").rb_collection('javascript/semi-item.htm');
こちらの一行。
id が bp_holder というブロック(div)に javascript/semi-item.htm の中に記述されている複数のバナーから1つを表示する。という意味になります。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript" src="javascript/rb_collection.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#bp_holder").rb_collection('javascript/semi-item.htm');
});
</script>
</head>
<body>
<!-- ランダムバナーが表示される場所 -->
<div id="bp_holder"></div>
</body>
</html>
そして、semi-item.htm には複数のバナーを並べておきます。
ファイルの拡張子からもわかるように、ただの HTML ファイルになっており…
<html> <body> <div> <!-- ひとつ目のバナー --> <table cellspacing="0" cellpadding="0" width="184" border="0" class="rb_collection"> <tr> <td>BLOG:</td> <td><a href="http://hampom.wordpress.com/"></a></td> </tr> <tr> <td>TWITTER:</td> <td><a href="http://twitter.com/hampom/"></a></td> </tr> </table> <!-- ふたつ目のバナー --> <div class="rb_collection"> <a href="http://twitter.com/hampom/"><img src="http://a3.twimg.com/profile_images/483611929/avatar.png"></a> </div> </div> <body> </html>
おおきな div要素の中に、さらに table や div といったブロックがあり css の class 指定「rb_collection」がされています。
この rb_collection が設定されている要素がランダムで元のページに出力されて表示されます。
初めて作ってみたんですが、とりあえず希望通り動いていますのでヨシとしております。改善点や問題点などがあればご指摘いただけると嬉しいです(*´д｀*)
Codeigniter – Form_validationクラス
Codeigniter の Form_validation クラスのヘルパー関数。
フォームの入力内容にエラーがあった場合なんかに、再度フォームを表示する必要がある。その際に、入力された内容をフォームに予めセットしておく事をよくする。 input の type に合わせて、色々なヘルパーがある。
codeigniter フォーム・バリデーションクラス： ヘルパー関数リファレンス
set_value() なんかは、そのまま表示するものなので良いのだけれど、プルダウン(set_select)やラジオボックス(set_radio)なんかでは、 引数が3つ。
第一が select や radio フォームの名前、第二が 値、そして第三が チェックを付ける(か、選択状態にする)などの true / false になっている。
こいつが厄介で、毎度プログラムでどの値が選択されているかどうかをチェックし、 true または false をセットしなくてはいけなくて面倒だった。
そこで、 true もしくはfalse 以外の値の場合は、第二引数と比較して同一であればチェックを付けるように修正した。
/**
* Set Select
*
* Enables pull-down lists to be set to the value the user
* selected in the event of an error
*
* @access public
* @param string
* @param string
* @return string
*/
function set_select($field = '', $value = '', $default = FALSE)
{
if ( ! isset($this->_field_data[$field]) OR ! isset($this->_field_data[$field]['postdata']))
{
if (!is_bool($default))
{
if($default == $value)
return ' selected="selected"';
else
$default = false;
}
if ($default === TRUE AND count($this->_field_data) === 0)
{
return ' selected="selected"';
}
return '';
}
$field = $this->_field_data[$field]['postdata'];
if (is_array($field))
{
if ( ! in_array($value, $field))
{
return '';
}
}
else
{
if (($field == '' OR $value == '') OR ($field != $value))
{
return '';
}
}
return ' selected="selected"';
}
これと、こっち。
/**
* Set Radio
*
* Enables radio buttons to be set to the value the user
* selected in the event of an error
*
* @access public
* @param string
* @param string
* @return string
*/
function set_radio($field = '', $value = '', $default = FALSE)
{
if ( ! isset($this->_field_data[$field]) OR ! isset($this->_field_data[$field]['postdata']))
{
if (!is_bool($default))
{
if($default == $value)
return ' checked="checked"';
else
$default = false;
}
if ($default === TRUE AND count($this->_field_data) === 0)
{
return ' checked="checked"';
}
return '';
}
$field = $this->_field_data[$field]['postdata'];
if (is_array($field))
{
if ( ! in_array($value, $field))
{
return '';
}
}
else
{
if (($field == '' OR $value == '') OR ($field != $value))
{
return '';
}
}
return ' checked="checked"';
}
それぞれを、MY_Form_validation.php に追加して application の libraries に置いておけばOK.
