var allCitys = [] ;
$.ajax({
type : "get",
url : _allcinemacityUrl,
data : {},
async : false,
success : function(data){
var citys = jQuery.parseJSON(data);
if(citys.code == 0){
var ccityResps = jQuery.parseJSON(citys.msg);
for(var i=0; i<ccityResps.length; i++){
allCitys[i] = {
cityid:ccityResps[i].cityid,
cityname:ccityResps[i].cityname
};
}
}
}
});
$('#ccityName').autocomplete({
source: function(query, process) {
var a = new Array();
for ( var i = 0; i < allCitys.length; i++) {
if (allCitys[i].cityname.indexOf(query) >= 0) {
a.push(allCitys[i]);
}
}
return a;
},
formatItem: function(item) {
return item.cityname + '(' + item.cityid + ')';
},
setValue: function(item) {
$('#ccityId').val(item.cityid);
return {
'data-value' : item.cityname,
'real-value' : item.cityid
};
},
minLength: 1
});
分享到:
相关推荐
在探讨如何利用jQuery的AutoComplete插件结合Ajax与JSON数据实现自动补全功能之前,我们首先需要理解几个关键概念:jQuery、Ajax、JSON以及AutoComplete。 ### jQuery简介 jQuery是一款快速、简洁的JavaScript库,...
**jQuery Autocomplete 知识点详解** `jQuery Autocomplete` 是一个非常实用的功能,它能够为用户在输入框中提供动态的建议或自动补全,极大地提升了用户体验。这个功能是基于 jQuery UI 库中的 `Autocomplete` ...
首先,我们需要在页面中引入jQuery库和Autocomplete的CSS及JavaScript文件。在`<head>`部分,添加以下引用: ```html <script src="/scripts/Jquery.autocomplete/jquery.autocomplete.js" type="text/javascript">...
- 在 `<body>` 标签内部,可以使用 `<h1>` 标签来定义网页的主标题,结合 `<article>`、`<section>` 等元素构建页面结构。 #### 四、表单2.0 HTML5 对表单进行了重大改进,增加了新的表单元素和属性,提高了用户...
这个案例将展示Ajax技术如何在不刷新整个页面的情况下,与服务器进行数据交互,实现更流畅的用户体验。 首先,让我们来了解什么是Ajax。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个页面的...
- **离线储存**: 包括`localStorage`, `sessionStorage`和`Application Cache`。 - **原理**: 数据被缓存于客户端,即使断网也能访问应用的一部分。 **11. 浏览器对HTML5离线储存资源管理与加载?** - 浏览器会...
- **离线存储**主要通过`applicationCache`接口实现,开发者可以通过manifest文件指定哪些资源需要离线存储。 - 当用户访问页面时,浏览器会下载并缓存manifest文件中指定的所有资源,以便在离线状态下仍然能够访问...
- 可以通过设置`autocomplete="off"`来禁用自动完成功能。 **16、如何实现浏览器内多个标签页之间的通信?(阿里)** - 可以通过Web Storage API(`localStorage`/`sessionStorage`)或`IndexedDB`等技术来实现跨标签...
1. 页面布局:首先,我们需要设计一个简洁且易于使用的搜索界面,类似于百度的首页。这包括输入框、搜索按钮以及可能的高级搜索选项。使用HTML5和CSS3可以创建响应式布局,确保在不同设备上都能良好显示。 2. 表单...
3. 避免重复加载:通过`cache`选项,可以缓存异步加载的内容,避免重复请求。 4. 事件监听:包括`create`, `activate`, `beforeActivate`等,便于进行定制化操作。 5. 动画效果:通过`animation`选项,可以设置标签...
AccordionPanel是一个可以展开和折叠的面板组件,常用于组织页面上的内容区域,实现内容的隐藏和显示。 ##### 3.2 AjaxBehavior AjaxBehavior允许在不重新加载整个页面的情况下执行AJAX请求,从而提高了应用程序的...
<p:autoComplete id="autoComplete" value="#{bean.value}" completeMethod="#{bean.completeMethod}"> </p:autoComplete> ``` ##### 3.6 Barcode Barcode 组件允许您在网页上生成各种类型的条形码图像。 **基本...
float:center" autocomplete="off"></el-input> </el-form-item> ``` 这段代码中的`<img>`标签通过`onclick`事件绑定一个函数,用于刷新图片并获取新的验证码。`<el-input>`组件用于输入用户输入的验证码,并...
此外,浏览器可能会记住用户之前在特定输入框中输入的信息,当再次访问页面时,这些信息会自动填充。虽然这在某些情况下是便利的,但也可能导致与初始值的重叠。可以通过在HTML头部添加以下代码来禁用浏览器的自动...
通过监听这些事件,开发者可以执行额外的操作,如记录用户选择、更新页面状态等。 5. **自定义外观和行为**:jQuery UI的样式可以通过CSS进行调整,以适应网站的视觉风格。此外,`appendTo`选项可以改变下拉菜单的...
10. **jQuery AJAX与jQuery UI组件**: 结合jQuery UI库,可以轻松地创建如 autocomplete, tabs, dialog 等交互丰富的组件,它们往往依赖于AJAX来动态加载内容。 通过学习和掌握jQuery AJAX动态刷新技术,开发者可以...
自动完成功能 <input type=text autocomplete=on>打开该功能 <input type=text autocomplete=off>关闭该功能 窗口最大化 (window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)"> 无...