勉強したことのメモ

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

  関連記事

getElementsByTagName

うろ覚えだけど業務中に、 document.getElementById('aa ...

jQueryで関数処理中にブラウザのブロック(intro.js)

Ajaxで処理を行っている間、他の処理を行わせたくなかった。 「now load ...

フォームのpasswordとtextをjQueryで切り替えて

パスワード入力の際、大抵「●●●」みたいな形で隠されるが、 jQueryでそれを ...

jQueryでimgタグのsrcを変える

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

jQueryでのやりたい事

フォーム周りをよく使うのでまとめておく。 ・テキストボックスのvalue取得、書 ...

配列をjQueryで取り扱う

やりたかった事は、 ・テキストボックスが複数ある。そのページに送信するクエリによ ...

jQueryでセレクトメニューにcheckedをつける

セレクトメニュー(セレクトボックス)で特定の項目をデフォルトで選択しておきたかっ ...

POP広告をjQueryで再現する方法

サイト内のリンクをクリックすると、新しいタブもしくはウィンドウで開く広告をちょい ...

jQueryで後から追加された要素にイベントを設定

jQueryで.html()等を使って追加した要素に対してイベントを設定したかっ ...

テキストエリアのリアルタイムプレビュー

テキストエリア内に書いた内容をリアルタイムで プレビューする機能が必要となり、教 ...