勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

jQueryでIPから位置情報の取得

      2014/05/19

jQueryのプラグインでお手軽にIPから
位置情報や経度緯度等調べられたのでメモ。

■jqIpLocation
http://jquery-plugins.net/jqIpLocation/jqIpLocation.html

■ソース
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="jqIpLocation.js"></script>
<script>
function getLocation() {
if ($('#txtIP').val() != "") {
$.jqIpLocation({
ip : $('#txtIP').val(),
locationType : 'city',
success: function(location) {
$('#divIP').append('<div><span class="title">IP : </span><span class="result">'+location.ipAddress+'</span></div>');
$('#divIP').append('<div><span class="title">Country : </span><span class="result">'+location.countryName+'</span></div>');
$('#divIP').append('<div><span class="title">Country Code : </span><span class="result">'+location.countryCode+'</span></div>');
$('#divIP').append('<div><span class="title">City : </span><span class="result">'+location.cityName+'</span></div>');
$('#divIP').append('<div><span class="title">Region : </span><span class="result">'+location.cityName+'</span></div>');
$('#divIP').append('<div><span class="title">Latitude : </span><span class="result">'+location.latitude+'</span></div>');
$('#divIP').append('<div><span class="title">Longitude : </span><span class="result">'+location.longitude+'</span></div>');
}
});
}
}
</script>
<title>IPから位置情報を取得</title>
</head>
<body>
<div>IP Adress : <input id="txtIP" type="text" />
<input type="button" value="submit" onclick="getLocation();" />
</div>
<br/>
<div id="divIP"></div>
</body>
</html>

 - jQuery

  関連記事

jquery_logo
画像をサムネイル⇔クリックで拡大(lightbox)

画像をサムネイル表示してクリックしたら大きく表示する というのがlightbox ...

jquery_logo
jQueryでチェックボックスの全チェック&チェック解除

フォームのチェックボックスで「全てにチェックを入れる」「全てのチェックを外す」と ...

jquery_logo
pjaxについてのメモ

ずっと気になっていたpjaxについてのメモ。 ■参考サイト http://chi ...

jquery_logo
要素の点滅

やりたかった事はaタグ内で囲まれている部分を点滅。 <blink>だ ...

jquery_logo
jQueryでimgタグのsrcを変える

やりたかった事はイベントに応じてimgタグの src内のURLを変更。attrを ...

jquery_logo
jQueryの指定されたイベントを実行する(trigger)

jQueryで $('ID').trigger('click'); というみたこ ...

jquery_logo
jQueryで電話番号チェック

やりたかったことはjavascriptかjQueryで 電話番号のバリデート。 ...

1422186794_sqliteicon
PHPとSQLiteでi-mobileのデータをグラフ化

i-mobileでクリック保証のアフィリエイトだけど数値が並んでいるだけでグラフ ...

flash_player_11_icon_rgb
FlashとjQueryを組み合わせたプラグインでWebカメラで撮影した画像をアップロード

FlashとjQueryを組み合わせたプラグインを用いてWebカメラで撮影した画 ...

jquery_logo
submit関連のjQuery

<?php //jQueryでのsubmit,エンターキーでのsubmit ...