vcxiaohan2
vcxiaohan2

jquery实现酷炫的抽奖器效果

请在这里查看示例 ☞ award示例

使用介绍

  • 可以自定义行、列数以及每次选中的个数
  • 点击初始化按钮，即可加载功能，点击开始抽奖进行第一次抽奖
  • 已抽过的用户不会再被抽到
  • 鼠标移出再移入可继续下一次抽奖

源码示例

  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">  
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>  
    <title>demotitle>  
    <script src="../js/jquery-1.11.3.min.js">script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        html, body, .view {
            width: 100%;
            height: 100%;
            background: #ddd;
        }
        .awardCtn {
            width: 90%;
            height: 90%;
            transform: translate(5%, 5%);
            position: relative;
        }
        .place {
            float: left;
            box-sizing: border-box;
            border-radius: 5px;
            overflow: hidden;
            border: 1px solid white;
        }
        .place img {
            width: 100%;
            height: 100%;
        }
        .awardShow {
            position: absolute;
            background: #fcffe5;
        }
        .red {
            border: 4px solid blue;
        }
        .grey {
            border: 4px solid red;
        }
        .start {
            position: absolute;
            width: 50%;
            height: 50%;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            font-size: 50px;
            color: white;
            background: #FF745B;
            border: 2px solid #e8634a;
            cursor: pointer;
            border-radius: 35px;
        }
        .show {
            width: 100%;
            height: 100%;
        }
        .awardPhoto {
            float: left;
            height: 100%;
        }
        .awardPhoto img {
            max-width: 100%;
            height: 100%;
            margin: 0 auto;
            display: block;
            box-sizing: border-box;
            padding: 5px;
        }
    style>
head>  
<body>  
    <div class="view">
        行数：<input class="a" type="text" value="8" />
        列数：<input class="b" type="text" value="12" />
        每次选中个数：<input class="c" type="text" value="4" />
        <button class="d">初始化button>
        <div class="awardCtn">
            <div class="awardShow">
                <button class="start">开始抽奖button>
                <div class="show">div>
            div>
        div>
    div>
<script>  
    $(function() {
        $('.d').on('click', function() {
            // 假设总照片数 36
            var oneTimeShowNum = $('.c').val() || 4,// 每次选中个数
                line = [+($('.a').val() || 8), (+$('.b').val() || 12)];// 行、列数

            var maxNum = (line[0]+line[1])*2-4;// 最大照片数

            // 生成div
            var html = '';
            for(var i=0; i0]; i++) {
                for(var j=0; j1]; j++) {
                    html += '
'" y="'+ i +'">
';
                }
            }
            $('.awardCtn').append(html);

            $('.place').css({
                'width': 100/line[1] +'%',
                'height': 100/line[0] +'%'
            })
            $('.awardShow').css({
                'width': (100-100/line[1]*2) +'%',
                'height': (100-100/line[0]*2) +'%',
                'top': 100/line[0] +'%',
                'left': 100/line[1] +'%'
            })
            $('head').append('');

            // 标序号
            var index = 0,
                x = 0,
                y = 0;

            while(x1]-1) {
                index++;
                $('[x='+x+'][y='+y+']').attr('index', index);
                x++;
            }
            while(y0]-1) {
                index++;
                $('[x='+x+'][y='+y+']').attr('index', index);
                y++;
            }
            while(x>0) {
                index++;
                $('[x='+x+'][y='+y+']').attr('index', index);
                x--;
            }
            while(y>0) {
                index++;
                $('[x='+x+'][y='+y+']').attr('index', index);
                y--;
            }

            $('.place:not([index]) img').remove();
            // 设置图片
            $('[index]').each(function(i) {
                $('img', this).attr('src', 'src/'+ $(this).attr('index') +'.png');
            })

            $('.awardShow').on('mouseenter', function() {
                $('.start').show();
            })
            $('.awardShow').on('mouseleave', function() {
                $('.start').hide();
            })

            // 开始抽奖
            $('.start').on('click', function() {
                var $this = $(this);
                $this.attr('disabled', true).hide();
                $('.show').empty();

                var time = 0,
                    cur = 1;
                (function fun() {
                    var $awardPhoto = $('
').appendTo('.show');
                        vOld = vNew = parseInt(Math.random()*30)+30;
                    (function timer() {
                        setTimeout(function() {
                            var num = cur%maxNum;
                            var sameTime = 0
                            while($('[index='+ (num?num:maxNum) +']').is('.grey')) {
                                if(sameTime>maxNum) {
                                    $('.start').off('click');
                                    break;
                                }
                                cur++;
                                sameTime++;
                                num = cur%maxNum;
                            }
                            if(vNew>1) {
                                $('[index]').removeClass('red');
                                $('[index='+ (num?num:maxNum) +']').addClass('red');
                                $('img', $awardPhoto).attr('src', 'src/'+ (num?num:maxNum) +'.png');
                                cur++;

                                if(vNew>10) {
                                    vNew *= .99;
                                }else {
                                    vNew *= .97;
                                }

                                timer();
                            }else{
                                $('.red').addClass('grey');
                                if(time < oneTimeShowNum-1) {
                                    time++;
                                    fun();
                                }else {
                                    $this.removeAttr('disabled');
                                }
                            }
                        }, vNew>10?vNew:vOld-vNew);          
                    })();
                })();
            })
        })
    })
script>  
body>  
html>

你可能感兴趣的:(javascript实例)

  • Element-plus封装表格Validate 努力搬砖的宣 vue.js前端javascriptelementui
    Element-plus实现表格内的表单验证：useAttrValidateHook在Vue.js项目中，表单验证是一个常见的需求，尤其在处理复杂表格编辑场景时。本文将详细介绍一个基于Vue3的自定义Hook——useAttrValidate，它提供了一种便捷的方式来处理表格组件中的字段校验。效果如下：1.导入与初始化Javascriptimport{reactive,nextTick}from"
  • 掌握 JavaScript：从基础到高级，全面提升编程技能 跟着小郑学前端 javascript开发语言ecmascript
    JavaScript是一种广泛应用于网页开发的编程语言，它使网页具有动态交互的能力。作为Web开发的核心技术之一，掌握JavaScript基础是每位开发者的必备技能。本文将介绍JavaScript的基础知识，包括数据类型、运算符、控制结构、函数等内容，并通过代码示例帮助大家理解。1.JavaScript数据类型JavaScript主要有以下几种数据类型：数据类型描述示例String字符串类型，用于
  • Vue-Router路由动态缓存组件(keep-alive)，vue2/vue3不同写法 码喽的自我修养 vue2/3从基础到起飞vue.js前端javascript缓存vue前端框架AI编程
    个人简介：某大型国企资深软件开发工程师，信息系统项目管理师、CSDN优质创作者、阿里云专家博主、华为云云享专家，分享前端后端相关技术与工作常见问题~作者：码喽的自我修养❣️专栏：vue2/3从基础到起飞若有帮助，还请关注➕点赞➕收藏，不行的话我再努努力文章目录一、简介它的主要作用是缓存不活动的组件实例，而不是销毁它们。基本用法生命周期钩子二、定义是否缓存组件三、缓存组件相关配置1.通过:inclu
  • 【YashanDB知识库】YCM数据库托管遇到的问题 数据库
    本文内容来自YashanDB官网，原文内容请见https://www.yashandb.com/newsinfo/7281308.html?templateId=171...YCM托管了集群，现在显示数据库处于故障状态，按照告警项建议检查实例的状态是正常运行的问题现象：查看dba\_users视图发现yasom用户不存在。问题原因：YCM运维工具是通过yasdb中的yasom用户进行数据库管理的，
  • 【Python】Python之列表List添加插入元素 mjiansun Python
    本文代码上下文person_dev_group=["徐强","倍总","航神"]第一种方式：append（）方法说明：list的实例方法append（），会在list的尾部添加一个元素person_dev_group.append("大森")第二种方式：insert（）方法，指定下标说明：index值可以为正数、也可以为负数，超出list范围的index值，将在list的头部或者尾部插入元素per
  • GO语言使用Nacos（nacos-sdk-go的使用） dream21st goland学习笔记golang微服务java
    文章目录1注册中心使用1.1配置说明1.2注册服务1.3拉取服务1.4获取服务方法说明获取服务信息：获取所有实例列表：获取健康实例列表：获取一个健康实例：监听服务变化：取消服务监听：分页获取服务名列表：2配置中心使用发布数据：发布一个JSON数据：删除配置文件：获取配置文件里面的数据：监听配置文件的变化：取消监听配置文件的变化：搜索配置文件：Nacos/nɑ:kəʊs/是DynamicNaming
  • JavaScript系列（32）-- WebAssembly集成详解 陳沉辰陈 JavaScriptjavascriptwasmudp
    JavaScriptWebAssembly集成详解今天，让我们深入了解JavaScript与WebAssembly的集成，这是一项能够显著提升Web应用性能的关键技术。WebAssembly基础概念小知识：WebAssembly（简称Wasm）是一种低级的类汇编语言，它具有紧凑的二进制格式，能够以接近原生的速度运行。它被设计为可以和JavaScript一起协同工作，为Web应用提供高性能计算能力。
  • 深入解析Java中的动态代理与反射机制 爪哇学长 Java应用程序编程接口javapython开发语言
    文章目录反射机制工作原理内部实现细节高级使用技巧示例代码动态代理工作原理内部实现细节高级使用技巧示例代码基于接口的代理（JDKProxy）CGLIB代理示例（需引入CGLIB库）实践总结反射机制工作原理Java反射机制允许程序在运行时检查或“自省”类的信息，并可以创建对象实例、调用方法、访问字段等操作。它主要通过java.lang.reflect包提供的API来实现。内部实现细节Class类：每个
  • vue和reacts数据响应式的差异 每天吃饭的羊 react+ts新手vue.jsjavascript前端
    Vue的数据响应式：原理：Vue使用Object.defineProperty或Proxy（在Vue3中）来实现数据的响应式。当创建Vue实例时，会对data对象中的属性进行遍历，将其转换为响应式属性。对于Object.defineProperty，它会为每个属性定义getter和setter函数，getter会收集依赖（如模板中的表达式、计算属性或watch监听器），而setter会触发更新，通
  • TypeScript语言的字符串处理 轩辕烨瑾 包罗万象golang开发语言后端
    TypeScript语言的字符串处理在现代编程语言中，字符串处理是非常重要的一部分。对于TypeScript这样的语言，更是让开发者在处理字符串时得到了更为安全和强大的工具。本文将深入探讨TypeScript中的字符串处理技术，包括字符串的基本操作、模板字符串、字符串方法、正则表达式以及常用的字符串处理技巧等。一、TypeScript基础与字符串的基本操作TypeScript是JavaScript
  • STM32F1与STM32CubeIDE快速入门-USB虚拟串口(CDC) 视觉与物联智能 物联网全栈开发实战STM32STM32CubeIDEUSB嵌入式硬件物联网
    USB虚拟串口(CDC)文章目录USB虚拟串口(CDC)1、USB虚拟串口配置2、USB虚拟串口驱动实现3、运行结果4、STM32F1与STM32CubeIDE系列文章4.1STM32F1与STM32CubeIDE快速入门4.2STM32F1与STM32CubeIDE编程实例STM32F1USB外设实现了USB2.0全速总线和APB1总线间的接口。USB提供的串行接口，具有以下特点：1）简单性和灵
  • 如何用Netty实现一个负载均衡组件 youyouiknow tech-reviewjava后端架构
    一、总体架构一个基本的负载均衡组件通常包含以下几个核心模块：服务注册与发现(ServiceRegistry&Discovery):功能:维护可用的后端服务实例列表（例如IP地址和端口）。实现要点:注册:服务实例启动时，将自己注册到注册中心。发现:负载均衡器从注册中心获取服务实例列表。健康检查:定期检查服务实例的健康状态，剔除不健康的实例。可选技术:ZooKeeper,etcd,Consul,Nac
  • WPF架构关键技术剖析(2)--XAML、对象序列化、类动态实例化 广州接入 2Silverlight4学习笔记1C＃6编程感悟wpfdelphiui语言assemblyhtml
    我们知道对于界面元素的描述，WPF的XAML不是第一个，HTML就要早很多，delphi的dfm也是一种。界面描述和界面交互逻辑的分离是有很多好处的，比如有利于可视化设计，有利于界面复用等。微软总是想一统天下，WPF的出现也是这种理想。当然，这种理想的出现也是有实际需求支持的。对于应用程序架构来说,传统的CS和BS都在相互融合，所以整合这两种模式下的界面设计也有其需求，并有利于两种模式的转换和融合
  • VMware虚拟机迁移到阿里云 wxjlkh 服务器网络
    VMware虚拟机迁移到阿里云是一个涉及多个步骤的过程，具体如下：使用阿里云的服务器迁移中心（SMC）进行P2V或V2V迁移。如果是小型应用，可以通过制作镜像文件然后上传至阿里云OSS，并基于该镜像创建ECS实例。对于大型企业级应用，可能需要设计详细的迁移方案，包括数据迁移、网络规划、应用测试等环节需求分析：首先明确迁移的需求和目标，包括哪些虚拟机需要迁移，迁移的时间窗口，以及迁移后的运维管理等。
  • Oracle筑基篇-体系结构概览 CodeBe@r #Oracleoracle数据库Oracle体系结构
    1、体系结构一览今天梳理Oracle的整体的体系结构，后面再详细梳理其中重要的那些结构。图1Oracle体系机构思维导图2、组件作用概述Oracle有两大块组成，一大块是Oralce实例（oracleinstance）一大块是Oralce数据库（oracledatabase），Oracle数据库是实实在在存储在硬盘上的三类文件：数据文件、日志文件和控制文件。数据库启动起来以后，首先在内存划出一块空
  • php jwt解密token,php实现JWT(json web token)鉴权实例 数据科学人工智能 phpjwt解密token
    JWT是什么JWT是jsonwebtoken缩写。它将用户信息加密到token里，服务器不保存任何用户信息。服务器通过使用保存的密钥验证token的正确性，只要正确即通过验证。基于token的身份验证可以替代传统的cookie+session身份验证方法。JWT由三个部分组成：header.payload.signature以下示例以JWT官网为例header部分：{"alg":"HS256","
  • Oracle（2）Oracle数据库的主要组件有哪些？ 辞暮尔尔-烟火年年 Oracleoracle数据库
    Oracle数据库的主要组件包括以下几个部分，每个组件在数据库管理和操作中都起着至关重要的作用。以下是对这些组件的详细介绍，并结合一些代码示例来说明其功能。1.实例（Instance）Oracle实例是Oracle数据库的运行环境，由内存结构和后台进程组成。一个实例控制一个数据库的操作。内存结构系统全局区（SGA）：共享内存区，用于存储数据库缓存和共享信息。程序全局区（PGA）：为每个服务器进程分
  • arcgis js 怎么加载geoserver发布的wms服务 niuge No.1 1024程序员节
    arcgisjsapi加载wms服务，官方的参考样例：WMSLayer|SampleCode|ArcGISMapsSDKforJavaScript4.30|EsriDeveloper按照官方样例加载比较奇怪，我们平常习惯用url或者json的方式加载，稍微改一下就行，如下：constlayer=newWMSLayer({url:"http://127.0.0.1:8080/geoserver/ne
  • Python爬虫项目合集：200个Python爬虫项目带你从入门到精通 人工智能_SYBH 爬虫试读2025年爬虫百篇实战宝典:从入门到精通python爬虫数据分析信息可视化爬虫项目大全Python爬虫项目合集爬虫从入门到精通项目
    适合人群无论你是刚接触编程的初学者，还是已经掌握一定Python基础并希望深入了解网络数据采集的开发者，这个专栏都将为你提供系统化的学习路径。通过循序渐进的理论讲解、代码实例和实践项目，你将获得扎实的爬虫开发技能，适应不同场景下的数据采集需求。专栏特色从基础到高级，内容体系全面专栏内容从爬虫的基础知识与工作原理开始讲解，逐渐覆盖静态网页、动态网页、API数据爬取等实用技术。后续还将深入解析反爬机制
  • MongoDB详细讲解 + springboot集成 you0719 简单学点java数据库java
    MongoDB以JSON为数据模型的文档非关系型数据库垂直扩展在一个机器上进行性能扩展水平扩展多个机器的扩展定位特点定位为应用数据库,存储数据特点:量大/非敏感/一定的查询性能MongoDB的语法是JavaScript语法添加db.集合名.insert(js对象)编辑db.集合名.updateMany({key:value}{$set:{key:value}})删除db.集合名.deleteMan
  • uniapp APP端页面触发调用uniapp开发的webview里的方法 printf_824 uniapp分享uni-app
    原理：使用getCurrentInstance()获取当前组件的Vue实例，通过instance.proxy.$scope.$getAppWebview()获取Uniapp的原生WebView对象。使用WebView提供的evalJS方法，执行嵌入H5页面内的JavaScript代码functiongetData(){url.value="http://192.168.0.22:5174/#/pa
  • Blazor-ApexCharts 开源项目指南 凌桃莺Talia
    Blazor-ApexCharts开源项目指南项目地址:https://gitcode.com/gh_mirrors/bl/Blazor-ApexCharts一、项目介绍Blazor-ApexCharts是一个用于Blazor框架的图表组件库封装，它基于流行的前端图表库ApexCharts.js实现。这个项目旨在简化在Blazor应用中添加交互式图表的过程，无需直接处理复杂的JavaScript互
  • 阿里云服务器国际站：如何安装？？ 聚好云 阿里云服务器阿里云服务器国际站阿里云服务器代理商阿里云服务器云计算
    阿里云服务器国际站：如何安装？？在阿里云上安装和配置服务器通常涉及以下几个步骤。这里主要以创建一个ECS（ElasticComputeService，弹性计算服务）实例为例：###1.注册与登录-**注册账户**：如果还没有阿里云账号，请前往[阿里云官网](https://www.aliyun.com)注册一个账户。-**登录**：使用注册的账户登录阿里云控制台。###2.创建ECS实例-**访问
  • 阿里云服务器国际站：阿里云服务器的架构 聚好云 阿里云服务器代理商阿里云服务器阿里云服务器国际站阿里云服务器架构
    阿里云服务器的架构目录阿里云服务器的架构阿里云服务器的主要原理阿里云服务器国际站：阿里云服务器的架构计算架构：X86计算架构：这是最常见的架构，其CPU采用Intel处理器，企业级x86每一个vCPU都对应一个IntelXeon处理器核心的超线程。涵盖了计算型c7、通用型g7、内存型r7等多种实例规格，适用于绝大多数的使用场景，如Web网站应用、企业级应用、内存型或者关系型数据库类应用、高网络收发
  • SpringBoot之定义接口返回类型有几种方式？ java熬夜党 Javaspringbootjavamybatis
    SpringBoot系列教程之定义接口返回类型的几种方式实现一个web接口返回json数据，基本上是每一个javaer非常熟悉的事情了；那么问题来了，如果我有一个接口，除了希望返回json格式的数据之外，若也希望可以返回xml格式数据可行么？答案当然是可行的，接下来我们将介绍一下，一个接口的返回数据类型，可以怎么处理I.项目搭建本文创建的实例工程采用SpringBoot2.2.1.RELEASE+
  • Vue教程｜搭建vue项目｜Vue-CLI新版脚手架 cnsxjean vue.jsjavascript前端框架npmui
    一、安装Node环境安装Node及Npm环境Node下载地址：Node.js—RunJavaScriptEverywhereNode.js®isaJavaScriptruntimebuiltonChrome'sV8JavaScriptengine.https://nodejs.org/en/安装完成后，检查安装是否成功，并检查版本，命令如下：node-vnpm-vmac@MacdeMacBook-
  • ARM Cortex-M4 CPU指令大全：作用、原理与实例 TheJustice_ ARM微机原理arm开发
    引言在计算机系统中，CPU（中央处理器）是执行各种指令的核心部件。ARMCortex-M4是广泛应用于嵌入式系统中的一款处理器，其指令集架构（ISA）基于ARMv7-M。本文将介绍ARMCortex-M4处理器中的常见指令，包括它们的作用、工作原理，并通过具体例子帮助理解。1.数据传输指令1.1MOV作用：将数据从一个位置传输到另一个位置。原理：MOV指令复制数据，不改变数据源，只是在目标位置存储
  • MySQL学习笔记（8）--连接查询 绿皮豚二号 MySQLmysql数据库
    ·概念将多张表连在一起查询（会导致记录数行和字段数列发生改变）意义：在关系型数据库设计过程中，实体与实体之间是存在很多联系的。在关系型数据库表的设计过程中，遵循着关系来设计：一对一，一对多，多对多。通常在实际操作中，需要利用这层关系来保证数据的完整性。·交叉连接将两张表的数据与另外一张表彼此交叉（笛卡尔积）表1crossjoin表2--实例select*frommy_studentcrossjoi
  • Spring缓存自定义KeyGenerator的实现与应用 2501_90323865 spring缓存java个人开发
    在Spring框架中，缓存机制是一种常用的优化手段，可以有效减少对数据库等后端系统的访问次数，提高应用性能。而自定义KeyGenerator则是让缓存更加灵活、精准地命中目标数据的关键所在。本文将通过一个实例，详细介绍如何实现并使用自定义的KeyGenerator。首先，我们需要创建一个自定义的KeyGenerator类。该类需要实现Spring提供的KeyGenerator接口，并重写gener
  • xss的过滤和绕过（2） rzydal 学习笔记网络安全xss计算机网络
    xss的过滤和绕过分类过滤主要有两层，分别为WAF层和代码层，WAF（web应用防火墙）通常是在外部，在主机或者网络硬件上，对HTTP请求进行过滤拦截，而代码层是在编写web应用的过程中，直接实现或者音乐第三方库，对用户输入进行过滤，但是JavaScript语法非常灵活，所以对于普通的正则匹配，字符串比较，很难拦截xss。1.富文本过滤在发送邮件或者博客的情景下，用户有需求实现富文本的编辑，比如插
  • jquery实现的jsonp掉java后台 知了ing javajsonpjquery
    什么是JSONP？ 先说说JSONP是怎么产生的： 其实网上关于JSONP的讲解有很多，但却千篇一律，而且云里雾里，对于很多刚接触的人来讲理解起来有些困难，小可不才，试着用自己的方式来阐释一下这个问题，看看是否有帮助。 1、一个众所周知的问题，Ajax直接请求普通文件存在跨域无权限访问的问题，甭管你是静态页面、动态网页、web服务、WCF，只要是跨域请求，一律不准； 2、
  • Struts2学习笔记 caoyong struts2
    SSH : Spring + Struts2 + Hibernate 三层架构(表示层,业务逻辑层,数据访问层) MVC模式 (Model View Controller) 分层原则:单向依赖，接口耦合 1、Struts2  =  Struts  + Webwork 2、搭建struts2开发环境    a>、到www.apac
  • SpringMVC学习之后台往前台传值方法 满城风雨近重阳 springMVC
    springMVC控制器往前台传值的方法有以下几种： 1.ModelAndView    通过往ModelAndView中存放viewName：目标地址和attribute参数来实现传参：      ModelAndView mv=new ModelAndView();  mv.setViewName="success
  • WebService存在的必要性？ 一炮送你回车库 webservice
    做Java的经常在选择Webservice框架上徘徊很久，Axis  Xfire Axis2 CXF ，他们只有一个功能，发布HTTP服务然后用XML做数据传输。 是的，他们就做了两个功能，发布一个http服务让客户端或者浏览器连接，接收xml参数并发送xml结果。 当在不同的平台间传输数据时，就需要一个都能解析的数据格式。 但是为什么要使用xml呢？不能使json或者其他通用数据
  • js年份下拉框 3213213333332132 java web ee
    <div id="divValue">test...</div>测试 //年份 <select id="year"></select> <script type="text/javascript"> window.onload =
  • 简单链式调用的实现技术 归来朝歌 方法调用链式反应编程思想
    在编程中，我们可以经常遇到这样一种场景：一个实例不断调用它自身的方法，像一条链条一样进行调用 这样的调用你可能在Ajax中，在页面中添加标签： $("<p>").append($("<span>").text(list[i].name)).appendTo("#result");   也可能在HQ
  • JAVA调用.net 发布的webservice 接口 darkranger webservice
    /** * @Title: callInvoke * @Description: TODO(调用接口公共方法) * @param @param url 地址 * @param @param method 方法 * @param @param pama 参数 * @param @return * @param @throws BusinessException
  • Javascript模糊查找 | 第一章 循环不能不重视。 aijuans Way
    最近受我的朋友委托用js+HTML做一个像手册一样的程序，里面要有可展开的大纲，模糊查找等功能。我这个人说实在的懒，本来是不愿意的，但想起了父亲以前教我要给朋友搞好关系，再加上这也可以巩固自己的js技术，于是就开始开发这个程序，没想到却出了点小问题，我做的查找只能绝对查找。具体的js代码如下： function search(){ var arr=new Array("my
  • 狼和羊，该怎么抉择 atongyeye 工作
    狼和羊，该怎么抉择 在做一个链家的小项目，只有我和另外一个同事两个人负责，各负责一部分接口，我的接口写完，并全部测联调试通过。所以工作就剩下一下细枝末节的，工作就轻松很多。每天会帮另一个同事测试一些功能点，协助他完成一些业务型不强的工作。 今天早上到公司没多久，领导就在QQ上给我发信息，让我多协助同事测试，让我积极主动些，有点责任心等等，我听了这话，心里面立马凉半截，首先一个领导轻易说
  • 读取android系统的联系人拨号 百合不是茶 androidsqlite数据库内容提供者系统服务的使用
           联系人的姓名和号码是保存在不同的表中,不要一下子把号码查询来,我开始就是把姓名和电话同时查询出来的,导致系统非常的慢   关键代码:     1, 使用javabean操作存储读取到的数据 package com.example.bean; /** * * @author Admini
  • ORACLE自定义异常 bijian1013 数据库自定义异常
    实例： CREATE OR REPLACE PROCEDURE test_Exception ( ParameterA IN varchar2, ParameterB IN varchar2, ErrorCode OUT varchar2 --返回值,错误编码 ) AS /*以下是一些变量的定义*/ V1 NUMBER; V2 nvarc
  • 查看端号使用情况 征客丶 windows
    一、查看端口 在windows命令行窗口下执行： >netstat -aon|findstr "8080" 显示结果： TCP     127.0.0.1:80         0.0.0.0:0    &
  • 【Spark二十】运行Spark Streaming的NetworkWordCount实例 bit1129 wordcount
    Spark Streaming简介   NetworkWordCount代码   /* * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agreements. See the NOTICE file distributed with
  • Struts2 与 SpringMVC的比较 BlueSkator struts2spring mvc
    1. 机制：spring mvc的入口是servlet，而struts2是filter，这样就导致了二者的机制不同。 2. 性能：spring会稍微比struts快。spring mvc是基于方法的设计，而sturts是基于类，每次发一次请求都会实例一个action，每个action都会被注入属性，而spring基于方法，粒度更细，但要小心把握像在servlet控制数据一样。spring
  • Hibernate在更新时，是可以不用session的update方法的(转帖） BreakingBad Hibernateupdate
    地址：http://blog.csdn.net/plpblue/article/details/9304459 public void synDevNameWithItil() {Session session = null;Transaction tr = null;try{session = HibernateUtil.getSession();tr = session.beginTran
  • 读《研磨设计模式》-代码笔记-观察者模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ import java.util.ArrayList; import java.util.List; import java.util.Observable; import java.util.Observer; /** * “观
  • 重置MySQL密码 chenhbc mysql重置密码忘记密码
    如果你也像我这么健忘，把MySQL的密码搞忘记了，经过下面几个步骤就可以重置了（以Windows为例，Linux/Unix类似）： 1、关闭MySQL服务 2、打开CMD，进入MySQL安装目录的bin目录下，以跳过权限检查的方式启动MySQL mysqld --skip-grant-tables  3、新开一个CMD窗口，进入MySQL mysql -uroot  
  • 再谈系统论，控制论和信息论 comsci 设计模式生物能源企业应用领域模型
                               再谈系统论，控制论和信息论     偶然看
  • oracle moving window size与 AWR retention period关系 daizj oracle
    转自： http://tomszrp.itpub.net/post/11835/494147 晚上在做11gR1的一个awrrpt报告时,顺便想调整一下AWR snapshot的保留时间,结果遇到了ORA-13541这样的错误.下面是这个问题的发生和解决过程. SQL> select * from v$version; BANNER -------------------
  • Python版B树 dieslrae python
    话说以前的树都用java写的,最近发现python有点生疏了,于是用python写了个B树实现,B树在索引领域用得还是蛮多了,如果没记错mysql的默认索引好像就是B树... 首先是数据实体对象,很简单,只存放key,value class Entity(object): '''数据实体''' def __init__(self,key,value)
  • C语言冒泡排序 dcj3sjt126com 算法
    代码示例： # include <stdio.h> //冒泡排序 void sort(int * a, int len) { int i, j, t; for (i=0; i<len-1; i++) { for (j=0; j<len-1-i; j++) { if (a[j] > a[j+1]) // >表示升序
  • 自定义导航栏样式 dcj3sjt126com 自定义
    -(void)setupAppAppearance { [[UILabel appearance] setFont:[UIFont fontWithName:@"FZLTHK—GBK1-0" size:20]]; [UIButton appearance].titleLabel.font =[UIFont fontWithName:@"FZLTH
  • 11.性能优化-优化-JVM参数总结 frank1234 jvm参数性能优化
    1.堆 -Xms --初始堆大小 -Xmx --最大堆大小 -Xmn --新生代大小 -Xss --线程栈大小 -XX:PermSize  --永久代初始大小 -XX:MaxPermSize  --永久代最大值 -XX:SurvivorRatio --新生代和suvivor比例,默认为8 -XX:TargetSurvivorRatio --survivor可使用
  • nginx日志分割 for linux HarborChung nginxlinux脚本
    nginx日志分割 for linux 默认情况下，nginx是不分割访问日志的，久而久之，网站的日志文件将会越来越大，占用空间不说，如果有问题要查看网站的日志的话，庞大的文件也将很难打开，于是便有了下面的脚本   使用方法，先将以下脚本保存为 cutlog.sh，放在/root 目录下，然后给予此脚本执行的权限   复制代码代码如下: chmo
  • Spring4新特性——泛型限定式依赖注入 jinnianshilongnian springspring4泛型式依赖注入
    Spring4新特性——泛型限定式依赖注入 Spring4新特性——核心容器的其他改进 Spring4新特性——Web开发的增强 Spring4新特性——集成Bean Validation 1.1(JSR-349)到SpringMVC  Spring4新特性——Groovy Bean定义DSL Spring4新特性——更好的Java泛型操作API  Spring4新
  • centOS安装GCC和G++ liuxihope centosgcc
    Centos支持yum安装，安装软件一般格式为yum install .......，注意安装时要先成为root用户。 按照这个思路，我想安装过程如下： 安装gcc：yum install gcc 安装g++： yum install g++ 实际操作过程发现，只能有gcc安装成功，而g++安装失败，提示g++ command not found。上网查了一下，正确安装应该
  • 第13章 Ajax进阶（上） onestopweb Ajax
    index.html <!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/
  • How to determine BusinessObjects service pack and fix pack blueoxygen BO
    http://bukhantsov.org/2011/08/how-to-determine-businessobjects-service-pack-and-fix-pack/   The table below is helpful. Reference   BOE XI 3.x 12.0.0. y BOE XI 3.0 12.0. x. y BO
  • Oracle里的自增字段设置 tomcat_oracle oracle
    　大家都知道吧，这很坑，尤其是用惯了mysql里的自增字段设置，结果oracle里面没有的。oh，no 　　我用的是12c版本的，它有一个新特性，可以这样设置自增序列，在创建表是，把id设置为自增序列 create table t ( id 　　 　　 number generated by default as identity (start with 1 increment b
  • Spring Security（01）——初体验 yang_winnie springSecurity
    Spring Security（01）——初体验     博客分类： spring Security Spring Security入门安全认证        首先我们为Spring Security专门建立一个Spring的配置文件，该文件就专门用来作为Spring Security的配置
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他