只唐瑞
只唐瑞

JQueryUI之Autocomplete

JQuery UI 是以 JQuery 为基础的开源 JavaScript 网页用户界面代码库。包含底层用户交互、动画、特效和可更换主题的可视控件，这些控件主要包括：Accordion,Autocomplete,ColorPicker,Dialog,Slider,Tabs,DatePicker,Magnifier,ProgressBar,Spinner等，其中Autocomplete能够非常容易的帮我们实现类似于百度搜索的智能提示功能。最新JQuery UI可以从JQuery UI官网下载获得。
　　一、首先了解下JQueryUI提供的重要属性：
　　1. autoFocus：当智能提示框出现时，是否自动选中第一项，默认为false，即不选中。
　　2. delay：在按键后执行搜索的延时，默认为300ms。
       3. disabled：是否禁用自动完成功能，默认为false。
　　4. minLength：触发自动完成功能需要输入的最小字符数量。
　　5. source：即为指定智能提示下拉框中的数据来源，支持三种类型。
　　　　　Array，主要用于本地化数据提供，支持两种格式：字符串数组 [ "Choice1", "Choice2" ]及标签和值属性的Json格式数组 [ { label: "Choice1", value: "value1" }, ... ]
　　　　  String，用于ajax请求的远程地址链接，返回Array或Json格式字符串。
　　　　　Function，回调函数，最具有灵活性的一种方式，可用于返回任何数据源方式来实现自动完成，其中包含两个参数request，response通过request.term 来获取用户输入的值,通过response(argument)来对获取的数据源进行显示。
　　二、JQuery UI还提供了一些有用的方法：
　　1. close()：关闭智能提示选择框。　　
　　2. destroy()：销毁智能提示选择框，将其所产生的元素完全删除，使其恢复至初始状态。
　　3. disable()：禁用自动完成功能。
　　4. enable()：开启自动完成功能。
　　三、主要事件包括：
　　1. change(event, ui)：当值改变时发生，ui.item为选中的项。
　　2. close(event, ui)：当智能提示框关闭时发生。
　　3. create(event, ui)：当智能提示框创建时发生，可以在此事件中，对外观进行一些控制。
　　4. focus(event, ui)：当智能提示列表任意一项获得焦点时发生，ui.item为获得焦点的项。
　　5. open(event, ui)：当智能提示框打开或更新时发生。
　　6. response(event,ui)：在搜索完成后智能提示框显示前发生，可以在此事件中对显示项进行处理。
　　7. search(event, ui)： 在开始请求之前发生，可以在此事件中返回false来取消请求。
　　8. select(event, ui)：当智能提示框中任意一项被选中时发生，ui.item为选中的项。

复制代码 
<%@ Page Language="C#" AutoEventWireup="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Jquery UI Autocomplete</title>
<link rel="stylesheet" href="/themes/base/jquery.ui.all.css" />
<script type="text/javascript" src="/js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="/js/jquery.ui.core.min.js"></script>
<script type="text/javascript" src="/js/jquery.ui.widget.min.js"></script>
<script type="text/javascript" src="/js/jquery.ui.position.min.js"></script>
<script type="text/javascript" src="/js/jquery.ui.menu.min.js"></script>
<script type="text/javascript" src="/js/jquery.ui.autocomplete.min.js"></script>
</head>
<body>
    <div style="margin:20px 50px;">
        <input id="txtSearchKey" type="text" class="text ui-widget-content ui-corner-all" style="width:250px; height:30px;" />
        <input id="btnSubmit" type="button" class="ui-button ui-widget ui-state-default ui-corner-all" value="搜索" />
    </div>
    <script type="text/javascript">
        $(function() {
            $("#txtSearchKey").autocomplete(
            {
                source: function(request, response) {
                    $.ajax({
                        url: "http://demo.com/ajax/Autocomplete.ashx",
                        dataType: "jsonp",
                        data: {
                            top: 10,
                            key: request.term
                        },
                        success: function(data) {
                            response($.map(data.citylist, function(item) {
                                return { label: item.city, value: item.city }
                            }));
                        }
                    });
                },
　　　　　　　　　 select: function(event, ui) {
                    //提交搜索...
                },
                minLength: 2, 
                autoFocus: false, 
                delay: 500 
            });
        });
    </script>
</body>
</html>
复制代码

　　上例中实现了向远程域发送链接请求，需要将dataType设置为“jsopn”格式，或者通过$.getJSON函数亦可。response对json中所有数据项进行遍历操作，返回每一项的名称，值得注意的地方时，label表示智能提示框中的每一项显示的文本，而value表示每一项的值，即选中该项后所赋值给搜索框的value。另外为了相同关键字的反复发送搜索请求，我们还可加上本地缓存，其实就是用一个数组保存已经发送过请求的key和对应返回的data对象，所以也可以对以上js部分代码修改如下：

复制代码 
<script type="text/javascript">
        $(function() {
            var cache = {};
            $("#txtSearchKey").autocomplete(
            {
                source: function(request, response) {
                    var term = request.term;
                    if (term in cache) {
                        data = cache[term];
                        response($.map(data.citylist, function(item) {
                            return { label: item.city, value: item.city }
                        }));
                    } else {
                        $.ajax({
                            url: "http://demo.com/ajax/Autocomplete.ashx",
                            dataType: "jsonp",
                            data: {
                                top: 10,
                                key: term
                            },
                            success: function(data) {
                                if (data.citylist.length) {
                                    cache[term] = data;
                                    response($.map(data.citylist, function(item) {
                                        return { label: item.city, value: item.city }
                                    }));
                                }
                            }
                        });
                    }
                },
                select: function(event, ui) {
                    //提交搜索...
                },
                minLength: 2,
                autoFocus: false,
                delay: 500
            });
        });
    </script>
复制代码

　　对应服务端程序如下：

复制代码 
using System;
using System.Web;
using AutoCompleteDemo.common;
using System.Collections.Generic;
using System.Text;

namespace AutoCompleteDemo.ajax
{
    public class Autocomplete : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {
            string key = TextHelper.DangerStringClear(RequestHelper.GetQueryString("key"));
            int top = RequestHelper.GetIntQueryString("top", 10);
            string callback = TextHelper.DangerStringClear(RequestHelper.GetQueryString("callback")) + "({\"citylist\":[";
            if (!string.IsNullOrEmpty(key))
            {
                City city = new City();
                Dictionary<int, string> diclist = city.GetCityName(key, top);
                if (diclist != null && diclist.Count > 0)
                {
                    StringBuilder sbJson = new StringBuilder(150);
                    foreach (KeyValuePair<int, string> item in diclist)
                    {
                        sbJson.Append("{\"id\":" + item.Key + ",\"city\":\"" + item.Value + "\"},");
                    }
                    callback += sbJson.ToString().Length > 0 ? sbJson.ToString().TrimEnd(',') : "";
                }
            }
            context.Response.Write(callback + "]})");
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}
复制代码

　　必须注意的是，在发送跨域请求时，会自动附加一个callback参数（如果是通过$.getJOSN则是jsoncallback）在输出json数据时，必须将callback参数值输出，否则将无法调用到回调函数。
　　最后附上实现效果图：
JQueryUI之Autocomplete_第1张图片

你可能感兴趣的:(autocomplete)

  • 2019-07-09 AutoCompleteTextView 问题 皮皮铭
    实现自定义Adapter要实现Filterable接口，不然会报错重写getFilter()方法performFiltering()方法实现过滤数据的操作publishResults()用来接收performFiltering()的返回值，发布。
  • 使用vue3+ts封装一个自动补全输入框Autocomplete组件 温暖前端 javascript前端vue.js
    创建一个名为Autocomplete.vue的文件，在这个组件中，使用了Vue3的CompositionAPI，包括ref、watch、onMounted等。组件接收placeholder、debounce和clearable作为props，并根据这些props来渲染输入框和下拉菜单{{item}}import{defineComponent,ref,watch,onMounted}from'vu
  • vue 高德地图api爬坑之路（三）Autocomplete 和 PlaceSearch 小C_cao vue高德地图API
    添加页面控件搜索初始化插件编辑方法/**初始化搜索工具*/mapSearchInit(){letthat=this;//绑定自动提示AMap.plugin(['AMap.Autocomplete','AMap.PlaceSearch'],function(){varautoOptions={input:"tipInput",//值为界面上input空间idcity:'北京',}varautoCom
  • 下拉提示（GoogleSuggest) xedcoing 技术autocompletefunctionjavascriptstringjqueryclass
    样式：.autocomplete{width:200px;border:1pxsolid#999;background:white;position:absolute;overflow:hidden;list-style-type:none;padding-left:0;margin-left:0px;margin-top:0;}JS：（Jquery）var$autocomplete=$("").
  • 禁止浏览器默认填充密码 vue lzr请早点睡觉～ 前端javascriptvue.js
    禁止浏览器默认填充密码会和我的样式冲突所以禁止第一种：通过给表单元素添加autocomplete="off"属性，可以防止浏览器自动填充表单中的账号和密码。可以在input标签或整个form标签上使用：exportdefault{data(){return{username:'',password:''};}};为密码输入框动态设置name属性有时仅仅使用autocomplete="off"不能完
  • 【Vue】el-autocomplete禁用时仍会触发下拉的问题 益达是我 vuevue.jsjavascript
    文章目录问题解决问题el-autocomplete禁用时，点击后仍会触发下拉，导致出现bug解决试了一下官方disabled属性、@focus、@click.stop均不起作用，最后无奈只能在查询方法那里做处理functionqueryAsync(queryString,cb){//重点if(!queryString||isDis.value){cb([])return}constdata={}q
  • vue element input让浏览器不保存密码 niesiyuan000 vue.jselementuijavascript
    从网上看了很多，比如auto-complete="new-password"比如autocomplete="off"这是真的用不了啊，最后用css可以实现1、html2、datareach__vioSecretkey:'',//违纪秘钥reach__seePwd:false,3、methodsseePwd(){this.reach__seePwd=!this.reach__seePwd},4、cs
  • autocomplete 完成功能 曾经也是个少年
    链接定义和用法autocomplete属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。注释：autocomplete属性适用于，以及下面的类型：text,search,url,telephone,email,password,datepickers,range以及color。提示：在某些浏
  • 前端input密码自动填充问题解决方案,React项目 猛踹瘸子那条好腿の 前端
    在input上写入autoComplete='new-password'可以禁止浏览器的自动填充密码1定义一个变量const[inputType,setInputType]=useState('text')2进入页面的是否将密码输入框的type设置为text3再jsx函数体内声明onchange函数constonChangePass=(e)=>{setInputType('password')}只
  • vue+高德，百度地图 友人！ vue.js百度前端
    1，npm安装vue-amapnpminstallvue-amap--save2，main.js引入importVueAMapfrom'vue-amap';Vue.use(VueAMap);VueAMap.initAMapApiLoader({key:'',plugin:['AMap.Autocomplete','AMap.PlaceSearch','AMap.Scale','AMap.OverV
  • C#如何实现一个输入框输入,匹配提示数据 狂人开飞机 C#c#
    在C#中可以使用AutoCompleteStringCollection类来实现输入框的自动完成功能。首先需要创建一个包含所有候选项的字符串集合（List）或者从文件、数据库等地方获取到这些候选项。然后将该集合传递给TextBox控件的AutoCompleteCustomSource属性。下面是一个示例代码：usingSystem;usingSystem.Collections.Generic;u
  • VS Code 配置第三方库 类似pygame chinaherolts2008 python基础教程python基础教程
    打开终端用pip安装pygamepipinstallpygame显示上图信息就说明安装成功安装完成之后在Python的安装目录中可以找到\Pythonxx\Lib\site-packages打开VSCode->文件->首选项->设置->用户->扩展->Python->AutoComplete:ExtraPaths->在settings.json中编辑在json中添加代码如下(将路径换位你的Pyth
  • vscode解决自动补全突然失效的问题(c++) 大头哇 c++c++vscode
    1：打开:首选项----->设置2:在搜索框里搜索autocomplete,然后选择对应的语言将这两部分改成这种就可以使用了。
  • chrome浏览器自动填充密码的字号设置不生效 学敲代码的Stars chrome前端javascript
    问题刷新浏览器初始化字号很小随便点击一下就会恢复我设置的字号大小原因给表单设置自动填充autocomplete=“on”后，chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性解决办法方法一，对私有属性设置样式（没成功）input:-webkit-autofill::first-line{font-size:20px;}方法二，关闭自动填充试了官方的
  • 进阶1-2 android常用控件综述 我在西边等太阳 笔记进阶1android
    这里主要根据书本知识网络知识和使用过的控件及好用的第三方控件做一个总结统计，肯定不全面，但一下也想不到多少。一步步写下去发现真的是越基础的控件越精彩，因为现在有很多封装好的控件很少会去调原生的自己写，但是多了解一点也没有坏处。目录文本类1、TextView2、EditText3、AutoCompleteTextView（单项提示的自动完成文本框）4、MultiAutoCompleteTextVie
  • 07-JQuery插件应用 D丝学编程
    本教程主要以JqueryUI为例，简单介绍Jquery插件的使用。使用JQueryUI提供的基本功能，需要如下文件支持:(1)jquery-ui.css(2)jquery.js(3)jquery-ui.jsjqueryui主题风格:可以通过如下网站地址选择风格或者自定义https://jqueryui.com/themeroller/一、JqueryUI-AutocompleteJqueryUI-
  • 响应式Web开发项目教程（HTML5+CSS3+Bootstrap）第2版 例4-10 autocomplete属性 m0_73657966 前端html5css3
    代码autocomplete属性提交按钮运行效果首先输入“autocomplete属性”,单击“提交按钮”，再输入“abc”，单击“提交按钮”,多次输入“a”时将会出现如下页面效果。autocoplete属性（on：表单有自动完成功能；off：表单无自动完成功能）用于指定表单是否具有自动完成功能，所谓“自动完成”是指将表单控件输入的内容记录下来。当再次输入时，输入的历史纪录将会显示在一个下拉列表单
  • 关于vue3使用Element ui输入框无法输入的简单解决方法 橙子君Crush typescriptvue.jsjavascriptscsselementui前端
    这应该是解决elementui输入框无法输入最简单有效的方法了script部分加入下面的代码import{reactive}from"vue";constform=reactive({name:""});element组件v-model填上对应的变量名autocomplete自动补全输入框这种类型的输入框,需要再添加一个input事件
  • Implement Trie (Prefix Tree) kotic leetcode算法学习算法
    ProblemAtrie(pronouncedas"try")orprefixtreeisatreedatastructureusedtoefficientlystoreandretrievekeysinadatasetofstrings.Therearevariousapplicationsofthisdatastructure,suchasautocompleteandspellchecker
  • Implement Trie (Prefix Tree) kotic leetcode算法学习python
    ProblemAtrie(pronouncedas"try")orprefixtreeisatreedatastructureusedtoefficientlystoreandretrievekeysinadatasetofstrings.Therearevariousapplicationsofthisdatastructure,suchasautocompleteandspellchecker
  • 获取radio点击事件 千奇百怪的漫长旅行 js
     获取radio点击事件，不能用click(),而是用change().$('input:radio[name="options"]').change(function(){if($(this).is(":checked")){alert($(this).attr("autocomplete"));}else{alert(0);}});
  • element的el-autocomplete组件的使用（模糊匹配、自定义模板、远程搜索） 小白_ysf Elementjavascript前端vue.jselementui
    一、代码实现激活即列出输入建议输入后匹配输入建议自定义模板{{item.value}}{{item.address}}远程搜索exportdefault{name:'AutoComplete',data(){return{restaurants:[],state1:'',state2:'',state3:'',state4:'',};},mounted(){this.restaurants=thi
  • react + antd：AutoComplete 实现既可以自由输入又能下拉选择 羽墨灵丘 react.jsjavascript前端
    在工作中遇到一个需求，既能下拉选择，有要求可以自由输入没有的选项。刚开始考虑使用Select组件，发现只有多选（mode="tags"）的时候才能随意输入内容，但多选又不符合当前的业务需求。在犹豫要不要自定义一个组件来实现业务需求时，发现了AutoComplete组件，完美实现需求。AutoCompete自动完成适用情况需要一个输入框而不是选择器需要输入建议/辅助提示（另一种形式的选项）代码示例c
  • LoadRunner脚本开发中的一些快捷键的使用 晋阳十二夜 脚本开发脚本函数LoadRunner
    1）编码工具的使用自动补全输入：Tools->GeneralOptions->Environment->Autocompleteword显示功能语法：Tools->GeneralOptions->Environment->ShowFunctionSyntax2）脚本调试1.单步调试->F102.断点调试->鼠标移动到要设置断点的脚本位置，通过Insert->ToggleBreakpoint(F9)
  • autocomplete 属性 清除input框输入存留历史值,防止下拉历史值显示 廿二又 web前端html前端css历史浏览器
    autocomplete属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。注释：autocomplete属性适用于，以及下面的类型：text,search,url,telephone,email,password,datepickers,range以及color。如果打开on效果如下
  • Qt优秀开源项目之六：qt-material-widgets 草上爬 Qt优秀开源项目Qt控件meterial
    炫酷的Material风格Qt控件，这个开源库基于QtWidgets，已经实现了20个控件，但是已经有5年没更新了，比较可惜gihub地址：https://github.com/laserpants/qt-material-widgetsAppBarQtMaterialAppBarAutoCompleteQtMaterialAutoCompleteAvatarQtMaterialAvatarBad
  • element UI带输入建议输入框el-autocomplete点击回车下拉框不消失问题 杜蜜月 项目问题小记javascriptcss3vue.jshtml5
    问题描述点击回车(或者自己定义的icon图标）不能收起建议框解决当建议框的内容为空的时候建议框会自己收起search(){//把suggestions置空this.$refs.autocomplete.suggestions=[];}问题已解决，在点击回车和icon搜索图标时会收起建议框
  • Visual Studio Code作为React Native的开发IDE,智能提示等等插件安装 Loki_
    1、ReactNativeTools2、React-Native/React/Reduxsnippetsfores6/es73、ReactNativeSnippet4、ES7React/Redux/GraphQL/React-Nativesnippets5、ColorHighlight颜色高亮效果1效果26、Imagepreview图片预览效果1效果27、PathAutocomplete路径补齐8
  • 编程笔记 html5&css&js 028 HTML输入属性(2/2) 明月看潮生 #html5css3javascript少年工程师
    @[TOC](编程笔记html5&css&js028HTML输入属性(2/2))HTML5新半了很多输入属性。使表单输入更加细致，减少了页面编程的复杂性。HTML5输入属性HTML5为增加了如下属性：autocompleteautofocusformformactionformenctypeformmethodformnovalidateformtargetheight和widthlistmin和
  • vsCode中编写vue项目时，webpack配置的alias别名无效 汝若念卿
    1、vsCode工具配置（settings.json文件配置所有项目可用）解决方案一：在插件市场中安装PathIntellisense插件并启用。根据以下提示信息，修改vsCode配置文件settings.json文件：解决方案二：在插件市场中安装PathAutocomplete插件并启用。根据以下提示信息，修改vsCode配置文件settings.json文件：2、项目配置如项目需要单独配置，可
  • 统一思想认识 永夜-极光 思想
    1.统一思想认识的基础,才能有的放矢  原因:    总有一种描述事物的方式最贴近本质,最容易让人理解.    如何让教育更轻松,在于找到最适合学生的方式.          难点在于,如何模拟对方的思维基础选择合适的方式.   &
  • Joda Time使用笔记 bylijinnan javajoda time
    Joda Time的介绍可以参考这篇文章： http://www.ibm.com/developerworks/cn/java/j-jodatime.html 工作中也常常用到Joda Time，为了避免每次使用都查API，记录一下常用的用法：     /** * DateTime变化（增减） */ @Tes
  • FileUtils API eksliang FileUtilsFileUtils API
    转载请出自出处：http://eksliang.iteye.com/blog/2217374 一、概述 这是一个Java操作文件的常用库，是Apache对java的IO包的封装，这里面有两个非常核心的类FilenameUtils跟FileUtils，其中FilenameUtils是对文件名操作的封装;FileUtils是文件封装，开发中对文件的操作，几乎都可以在这个框架里面找到。 非常的好用。
  • 各种新兴技术 不懂事的小屁孩 技术
    1:gradle Gradle 是以 Groovy 语言为基础，面向Java应用为主。基于DSL（领域特定语言）语法的自动化构建工具。 现在构建系统常用到maven工具，现在有更容易上手的gradle， 搭建java环境: http://www.ibm.com/developerworks/cn/opensource/os-cn-gradle/ 搭建android环境： http://m
  • tomcat6的https双向认证 酷的飞上天空 tomcat6
    1.生成服务器端证书 keytool -genkey -keyalg RSA -dname "cn=localhost,ou=sango,o=none,l=china,st=beijing,c=cn" -alias server -keypass password -keystore server.jks -storepass password -validity 36
  • 托管虚拟桌面市场势不可挡 蓝儿唯美
    用户还需要冗余的数据中心，dinCloud的高级副总裁兼首席营销官Ali Din指出。该公司转售一个MSP可以让用户登录并管理和提供服务的用于DaaS的云自动化控制台，提供服务或者MSP也可以自己来控制。 在某些情况下，MSP会在dinCloud的云服务上进行服务分层，如监控和补丁管理。 MSP的利润空间将根据其参与的程度而有所不同，Din说。 “我们有一些合作伙伴负责将我们推荐给客户作为个
  • spring学习——xml文件的配置 a-john spring
    在Spring的学习中，对于其xml文件的配置是必不可少的。在Spring的多种装配Bean的方式中，采用XML配置也是最常见的。以下是一个简单的XML配置文件： <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.or
  • HDU 4342 History repeat itself 模拟 aijuans 模拟
    来源：http://acm.hdu.edu.cn/showproblem.php?pid=4342 题意：首先让求第几个非平方数，然后求从1到该数之间的每个sqrt(i)的下取整的和。 思路：一个简单的模拟题目，但是由于数据范围大，需要用__int64。我们可以首先把平方数筛选出来，假如让求第n个非平方数的话，看n前面有多少个平方数，假设有x个，则第n个非平方数就是n+x。注意两种特殊情况，即
  • java中最常用jar包的用途 asia007 java
    java中最常用jar包的用途 jar包用途axis.jarSOAP引擎包commons-discovery-0.2.jar用来发现、查找和实现可插入式接口，提供一些一般类实例化、单件的生命周期管理的常用方法.jaxrpc.jarAxis运行所需要的组件包saaj.jar创建到端点的点到点连接的方法、创建并处理SOAP消息和附件的方法，以及接收和处理SOAP错误的方法.  w
  • ajax获取Struts框架中的json编码异常和Struts中的主控制器异常的解决办法 百合不是茶 jsjson编码返回异常
    一:ajax获取自定义Struts框架中的json编码  出现以下 问题:       1,强制flush输出  json编码打印在首页 2, 不强制flush js会解析json 打印出来的是错误的jsp页面   却没有跳转到错误页面 3,  ajax中的dataType的json 改为text 会
  • JUnit使用的设计模式 bijian1013 java设计模式JUnit
    JUnit源代码涉及使用了大量设计模式 1、模板方法模式（Template Method）         定义一个操作中的算法骨架，而将一些步骤延伸到子类中去，使得子类可以不改变一个算法的结构，即可重新定义该算法的某些特定步骤。这里需要复用的是算法的结构，也就是步骤，而步骤的实现可以在子类中完成。   
  • Linux常用命令（摘录） sunjing crondchkconfig
    chkconfig --list   查看linux所有服务 chkconfig --add servicename 添加linux服务 netstat -apn | grep 8080  查看端口占用 env 查看所有环境变量 echo $JAVA_HOME 查看JAVA_HOME环境变量   安装编译器 yum install -y gcc
  • 【Hadoop一】Hadoop伪集群环境搭建 bit1129 hadoop
     结合网上多份文档，不断反复的修正hadoop启动和运行过程中出现的问题，终于把Hadoop2.5.2伪分布式安装起来，跑通了wordcount例子。Hadoop的安装复杂性的体现之一是，Hadoop的安装文档非常多，但是能一个文档走下来的少之又少，尤其是Hadoop不同版本的配置差异非常的大。Hadoop2.5.2于前两天发布，但是它的配置跟2.5.0，2.5.1没有分别。 &nb
  • Anychart图表系列五之事件监听 白糖_ chart
    创建图表事件监听非常简单：首先是通过addEventListener('监听类型',js监听方法)添加事件监听，然后在js监听方法中定义具体监听逻辑。 以钻取操作为例，当用户点击图表某一个point的时候弹出point的name和value，代码如下： <script> //创建AnyChart var chart = new AnyChart(); //添加钻取操作&quo
  • Web前端相关段子 braveCS web前端
    Web标准：结构、样式和行为分离   使用语义化标签 0）标签的语义：使用有良好语义的标签，能够很好地实现自我解释，方便搜索引擎理解网页结构，抓取重要内容。去样式后也会根据浏览器的默认样式很好的组织网页内容，具有很好的可读性，从而实现对特殊终端的兼容。 1）div和span是没有语义的：只是分别用作块级元素和行内元素的区域分隔符。当页面内标签无法满足设计需求时，才会适当添加div
  • 编程之美-24点游戏 bylijinnan 编程之美
    import java.util.ArrayList; import java.util.Arrays; import java.util.HashSet; import java.util.List; import java.util.Random; import java.util.Set; public class PointGame { /**编程之美
  • 主页面子页面传值总结 chengxuyuancsdn 总结
    1、showModalDialog returnValue是javascript中html的window对象的属性,目的是返回窗口值,当用window.showModalDialog函数打开一个IE的模式窗口时,用于返回窗口的值 主界面 var sonValue=window.showModalDialog("son.jsp"); 子界面 window.retu
  • [网络与经济]互联网+的含义 comsci 互联网+
          互联网+后面是一个人的名字 = 网络控制系统       互联网+你的名字 =  网络个人数据库       每日提示:如果人觉得不舒服,千万不要外出到处走动,就呆在床上,玩玩手游,更不能够去开车,现在交通状况不
  • oracle 创建视图 with check option daizj 视图vieworalce
    我们来看下面的例子： create or replace view testview as select empno,ename from emp where ename like ‘M%’ with check option; 这里我们创建了一个视图，并使用了with check option来限制了视图。 然后我们来看一下视图包含的结果： select * from testv
  • ToastPlugin插件在cordova3.3下使用 dibov Cordova
        自己开发的Todos应用，想实现“ 再按一次返回键退出程序 ”的功能，采用网上的ToastPlugins插件，发现代码或文章基本都是老版本，运行问题比较多。折腾了好久才弄好。下面吧基于cordova3.3下的ToastPlugins相关代码共享。       ToastPlugin.java package&nbs
  • C语言22个系统函数 dcj3sjt126com cfunction
    C语言系统函数一、数学函数下列函数存放在math.h头文件中Double floor(double num) 求出不大于num的最大数。Double fmod(x, y) 求整数x/y的余数。Double frexp(num, exp); double num; int *exp; 将num分为数字部分（尾数）x和 以2位的指数部分n，即num=x*2n，指数n存放在exp指向的变量中，返回x。D
  • 开发一个类的流程 dcj3sjt126com 开发
    本人近日根据自己的开发经验总结了一个类的开发流程。这个流程适用于单独开发的构件，并不适用于对一个项目中的系统对象开发。开发出的类可以存入私人类库，供以后复用。   以下是开发流程： 1. 明确类的功能，抽象出类的大概结构 2. 初步设想类的接口 3. 类名设计（驼峰式命名） 4. 属性设置(权限设置) 判断某些变量是否有必要作为成员属
  • java 并发 shuizhaosi888 java 并发
    能够写出高伸缩性的并发是一门艺术   在JAVA SE5中新增了3个包 java.util.concurrent java.util.concurrent.atomic java.util.concurrent.locks 在java的内存模型中，类的实例字段、静态字段和构成数组的对象元素都会被多个线程所共享，局部变量与方法参数都是线程私有的，不会被共享。
  • Spring Security（11）——匿名认证 234390216 Spring SecurityROLE_ANNOYMOUS匿名
    匿名认证 目录 1.1     配置 1.2     AuthenticationTrustResolver          对于匿名访问的用户，Spring Security支持为其建立一个匿名的AnonymousAuthenticat
  • NODEJS项目实践0.2[ express,ajax通信...] 逐行分析JS源代码 Ajaxnodejsexpress
      一、前言         通过上节学习，我们已经        ubuntu系统搭建了一个可以访问的nodejs系统，并做了nginx转发。本节原要做web端服务 及 mongodb的存取，但写着写着，web端就
  • 在Struts2 的Action中怎样获取表单提交上来的多个checkbox的值 lhbthanks javahtmlstrutscheckbox
    第一种方法：获取结果String类型 在 Action 中获得的是一个 String 型数据，每一个被选中的 checkbox 的 value 被拼接在一起，每个值之间以逗号隔开(,)。 所以在 Action 中定义一个跟 checkbox 的 name 同名的属性来接收这些被选中的 checkbox 的 value 即可。 以下是实现的代码： 前台 HTML 代码：
  • 003.Kafka基本概念 nweiren hadoopkafka
    Kafka基本概念：Topic、Partition、Message、Producer、Broker、Consumer。 Topic：             消息源（Message）的分类。 Partition：             Topic物理上的分组，一
  • Linux环境下安装JDK roadrunners jdklinux
    1、准备工作 创建JDK的安装目录： mkdir -p /usr/java/   下载JDK，找到适合自己系统的JDK版本进行下载： http://www.oracle.com/technetwork/java/javase/downloads/index.html   把JDK安装包下载到/usr/java/目录，然后进行解压： tar -zxvf jre-7
  • Linux忘记root密码的解决思路 tomcat_oracle linux
    1：使用同版本的linux启动系统，chroot到忘记密码的根分区passwd改密码 　　2：grub启动菜单中加入init=/bin/bash进入系统，不过这时挂载的是只读分区。根据系统的分区情况进一步判断. 　　3: grub启动菜单中加入 single以单用户进入系统. 　　4:用以上方法mount到根分区把/etc/passwd中的root密码去除 　　例如: 　　ro
  • 跨浏览器 HTML5 postMessage 方法以及 message 事件模拟实现 xueyou jsonpjquery框架UIhtml5
    postMessage 是 HTML5 新方法，它可以实现跨域窗口之间通讯。到目前为止，只有 IE8+, Firefox 3, Opera 9, Chrome 3和 Safari 4 支持，而本篇文章主要讲述 postMessage 方法与 message 事件跨浏览器实现。postMessage 方法 JSONP 技术不一样，前者是前端擅长跨域文档数据即时通讯，后者擅长针对跨域服务端数据通讯，p
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他