セレクトボックスで自動ページ移動(ジャンプ)

セレクトボックスで選択した項目のURLへページ遷移する方法をご紹介します。

デモ

JavaScript

JavaScript

var moveUrl = function(_this, targetName) {
	var url = _this.options[_this.selectedIndex].value;

	if (targetName) {
		window.open(url, targetName);
	} else {
		location.href = url;
	}
};

var sampleSelect = document.getElementById('sample');

sampleSelect.onchange = function() {
	moveUrl(this, '_blank');
};

HTML

<form action="" name="moveurl" id="moveurl">
	<select name="url" id="sample">
		<option value="http://www.yahoo.co.jp/">Yahoo</option>
		<option value="http://www.google.co.jp/">Google</option>
		<option value="http://jp.msn.com/">MSN</option>
	</select>
</form>

JavaScript逆引きリファレンス一覧へ戻る