JavaScriptのprototypeをつかったオブジェクト指向サンプルソース

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

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

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

関連記事