html+js經緯度輸入框值的範圍限制和輸入限制

html代碼

<body>
	<form action="url" method="post" id="saveData">
		<span>經度</span>
		<%-- 數字、小數點和-輸入限制 --%>
		<input type="text" name="i_longitude" id="i_longitude" value="${obj.longitude }" onKeyPress="if(event.keyCode!=46 && event.keyCode!=45 && event.keyCode<48 || event.keyCode>57) event.returnValue=false" />
		<span>緯度</span>
		<%-- 數字、小數點和-輸入限制 --%>
		<input type="text" name="i_latitude" id="i_latitude" value="${obj.latitude }" onKeyPress="if(event.keyCode!=46 && event.keyCode!=45 && event.keyCode<48 || event.keyCode>57) event.returnValue=false" />
	</form>
	<button class="save" onClick="doSave()">提交</button>

	<script type="text/javascript">
	function doSave() {
		// 經度值判斷i_longitude
		var longitude = $("#i_longitude").val();
		if (checkInputInt(longitude, -180, 180)) {
			alert('請輸入正確的經度,範圍:-180~180');
			return;
		}
		// 緯度值判斷i_latitude
		var latitude = $("#i_latitude").val();
		if (checkInputInt(latitude, -90, 90)) {
			alert('請輸入正確的緯度,範圍:-90~90');
			return;
		}
		if(confirm("確認提交?")) {
			$("#saveData").submit();
		}
	}
	// -和.和數值範圍判斷
	function checkInputInt(value, min, max) {
		if (value.indexOf('-') != -1) {
			if (value.indexOf('-') != 0) {
				return true;
			}
			var hCount = (value.split('-')).length-1;
			if (hCount > 1) {
				return true;
			}
			if (value.indexOf('.') != -1) {
				if (value.indexOf('.') == 1 || value.indexOf('.') > 4) {
					return true;
				}
				var dCount = (value.split('.')).length-1;
				if (dCount > 1) {
					return true;
				}
			}
		}
		if (value.indexOf('.') != -1) {
			if (value.indexOf('.') == 0 || value.indexOf('.') > 3) {
				return true;
			}
			var dCount = (value.split('.')).length-1;
			if (dCount > 1) {
				return true;
			}
		}
		if(parseInt(value) < min || parseInt(value) > max) {
			return true;
		}
	}
	</script>
</body>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章