EasyUI 搜索框

最新推荐文章于 2019-06-05 21:16:17 发布

bear_cab

最新推荐文章于 2019-06-05 21:16:17 发布

阅读量481

点赞数

本文链接：https://blog.csdn.net/phone13144830339/article/details/78849349

版权

<html>
	<head>
		<title>draggable</title>
		<link rel="stylesheet" type="text/css" href="H:/jQuery EasyUI/jquery-easyui-1.5.3/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="H:/jQuery EasyUI/jquery-easyui-1.5.3/themes/icon.css"/>
		<script type="text/javascript" src="H:/jQuery EasyUI/jquery-easyui-1.5.3/jquery.min.js"></script>
		<script type="text/javascript" src="H:/jQuery EasyUI/jquery-easyui-1.5.3/jquery.easyui.min.js"></script>
		<script>
			$(function (){
				$('#s').searchbox({
					/*width number：设置组件的宽度*/
					width:200
					/*searcher e：当搜索按钮被点击时执行*/
					,searcher:function(value,name){   
						alert(value);
					},
					/*
					value stirng：搜索框默认值
					prompt string：搜索框提示信息
					*/
					prompt:'请输入搜索内容'
					/*
					menu selector：通过选择器添加搜索菜单
					*/
					,menu:'#m'
				}); 
				
				/*
				menu none：返回搜索框属性对象
				textbox none：返回搜索框属性对
				getValue none：返回当前搜索关键字
				setValue value：设置搜索的关键字
				selectName name:设置搜索菜单类型
				getName：none：获取搜索菜单类型
				destroy none：清除搜索框组件
				*/
				var propertiesJSON = $('#s').searchbox('options');
				var properties = "";
				for(var item in propertiesJSON) {
					properties = properties +item+"属性的值："+propertiesJSON[item] + ";\n";
				}
				alert(properties);
				$('#s').searchbox('setValue','jQuery EasyUI');
				alert($('#s').searchbox('getValue'));
			})
		</script>
	</head>
	<body>
		<input type="text" id="s" name="eachName" />
		<div id="m" style="width:150px">
			<div data-options="name:'method1',selected:true">百度</div>
			<div data-options="name:'method2'">搜狗</div>
		</div>
	</body>
</html>