jquery,input框实时数据获取及完全改变后获取

最新推荐文章于 2023-04-10 13:55:42 发布

原创最新推荐文章于 2023-04-10 13:55:42 发布 · 5.6k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

JQuery 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一种使用jQuery实现的输入框与选择框交互的方法，通过change事件和keyup函数来实现实时更新地图显示位置的功能。具体包括：input框完全改变后触发change事件获取值；input框获取焦点后绑定keyup函数实现数据实时获取；select框选定元素的获取及其改变后的值。

input框完全改变后获取，可以用change事件；

input框实时数据获取，可在获取焦点后，绑定keyup函数；

select框选定元素的获取及改变后值的获取，在下面的例子中也有体现。

$(document).ready(function(){
	//get the map 时租
	/*
	var up_city0 = $("#up_city_0 option:selected").html();
	$('#up_city_0').change(function(){
		//alert($(this).children('option:selected').text()); 
		up_city0 = $(this).children('option:selected').html();
	})
	$("#up_location_0").focus(function(){ 
		$(this).bind("keyup", function(){
			var up_place0 = up_city0 + $(this).val();
			//alert(up_place0);
			$("#mapframe").attr('src','mapframe.php?place='+up_place0); 
		});
    });*/
	var up_city0 = $("#up_city_0 option:selected").html();
	$('#up_city_0').change(function(){
		//alert($(this).children('option:selected').text()); 
		up_city0 = $(this).children('option:selected').html();
	})
	$("#up_location_0").change(function(){ 
		var up_place0 = up_city0 + $(this).val();
		//alert(up_place0);
		$("#mapframe").attr('src','mapframe.php?place='+up_place0); 
	});
})