タグ: javascript

セレクトボックスで選択した値に応じて特定要素の表示を切り替える11行のJavaScriptを
prototypeを使ったオブジェクト指向の組み方などでがっちりかためてみたサンプルです。

$(function(){
	var ui_selecter = $('select[data-script*="visible-selector"][data-target]');
	if(ui_selecter[0]) ui_selecter.each(function(i, o) {
		if($($(o).attr('data-target'))[0]) $(o).on('change', function() {
			var current = $(this).find('option[data-id]:selected'),
				$target = $($(o).attr('data-target')).find('[data-id="' + current.attr('data-id') + '"]');
			if($target[0]) $target.show().siblings('[data-id]').hide();
		});
		$(o).trigger('change');
	});
});

See the Pen visible selector by webdev (@webdev-jp-net) on CodePen.0

Google Mapsやカーナビゲーションで有名なゼンリン地図が採用している日本測地系基準の緯度経度と
国土地理院地図が採用している最新の測地系である世界測地系を相互変換するスクリプトです。

See the Pen convert latlng by webdev (@webdev-jp-net) on CodePen.0

HEX（#ff000などの１６進数カラーコード）をrgbに変換するJavaScriptです。
HEX指定の色を、半透明にしたくてrgbaコードがほしい時に使いました。

See the Pen HEX <--> RGB by webdev (@webdev-jp-net) on CodePen.0

HEX→RGB

HEXは、R2桁+G2桁+B２桁が集合した6桁なので
この手順でRGBに変換できます。

1. substringで2桁ずつ３つに分解
2. parseIntで16進数から10進数に変換

RGB→HEX

HEXからRGBの逆パターンです。

1. R,G,Bそれぞれの値をparseIntで10進数から16進数に変換
2. ６桁に結合