Amadeus_711
Amadeus_711

使用bootstrap和select2制作的带搜索功能的下拉框

使用bootstrap和select2制作的带搜索功能的下拉框

  • 前言
    • 样式预览
    • 设计思路
  • 代码
    • 代码
    • 使用注意事项

前言

bootstrap和select2是强大的前端布局样式框架，其低调简约的风格深受人们的好评。本人在平时会制作一些基于bootstrap和select2的定制样式，算是练手吧！如有建议和意见，欢迎评论交流！

样式预览

使用bootstrap和select2制作的带搜索功能的下拉框_第1张图片

如上图所示，1是一个展示框，2是一个下拉框。下拉框内置搜索筛选功能，在下拉框中选中的元素会以标签的形式表现在展示框内。点击展示框内的标签，会删除当前的元素。如下图所示

使用bootstrap和select2制作的带搜索功能的下拉框_第2张图片

设计思路

1.展示框其实是一个div，使用监听事件change()监听下拉框的变化。
2.每当下拉框选中元素时，使用append()在展示框内加入拼接字符串形式的子元素。
3.对子元素的样式进行调整，子元素的文本为获取到的下拉框的value值（text值也可以，看自己需求）。
4.最后使用scrollTop()将展示框始终在最底下（这样做是一方展示框数据过多生成滚动条时，使展示框始终位于最底部，便于查看新增加的标签）

代码

代码

请注意导包！

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="./js/jquery-1.11.3.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <link href="./css/bootstrap/bootstrap.min.css" rel="stylesheet" />

    <script src="./select2-4.0.5/dist/js/select2.min.js"></script>
    <link href="./select2-4.0.5/dist/css/select2.min.css" rel="stylesheet" />

    <style>
        body {
            background-color: #eee
        }

        .sel_box {
            width: 300px;
            margin: 0 auto;
        }

        .sel_show {
            background-color: #fff;
            width: 300px;
            height: 80px;
            border: 1px solid #aaa;
            border-radius: 5px;
            overflow-y: scroll;
            font-style: normal;
            margin: 5px auto; 
        }

        .show_tag {
            padding: 2px 10px;
            margin:3px 5px;
            display: block;
            height: 25px;
            line-height: 20px;
            color: #333;
            background: #eee;
            text-align: center;
            float: left;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        /* 清除浮动代码 */
        .clearfloat:after {
            display: block;
            clear: both;
            content: "";
            visibility: hidden;
            height: 0
        }

        .clearfloat {
            zoom: 1
        }
    </style>
</head>

<body>
    <div class="sel_box">
        //展示框
        <div class="sel_show clearfloat" id="sel_show">
        </div>
        //下拉框
        <select id="sel_menu" value="" class="form-control">
            <option value=""></option>
                <option value="中国">中国</option>
                <option value="新加坡">新加坡</option>
                <option value="韩国">韩国</option>
                <option value="日本">日本</option>
        </select>
    </div>
    <script>
        //初始化select2下拉框
        $("#sel_menu").select2({
            maximumSelectionLength: 100000000000  //最多能够选择的个数
        });
        //渲染逻辑
        $(function () {
        	//监听下拉框事件
            $("#sel_menu").change(function () {
                //渲染展示框
                $("#sel_show").append("" + $("#sel_menu").val() + "").scrollTop(1000000000);  
            });
            //点击删除事件
            //事件委托至document，利用on()给所有未渲染的标签绑定click事件，冒泡传递给document
            $(document).on("click", "#show_tag", function () {
                $(this).remove();
            })
        });


    </script>

</body>

</html>

使用注意事项

1.注意导包，使用到jquery、bootstrap、select2 。
2.使用时注意父元素的tabindex属性，其会占用select2的tabindex=‘0’,导致select2的搜索框无法输入。删掉tabindex属性即可。（父元素为模态框时可能会遇到这个问题）如果删掉tabindex属性不管用，重写enforceFocus方法：$.fn.modal.Constructor.prototype.enforceFocus = function () {}；

你可能感兴趣的:(Web组件积累)

  • Linux中安装Tomcat 十一的学习笔记 运维中服务安装管理linuxtomcat运维
    文章目录一、Tomcat介绍1.1、Tomcat是什么1.2、Tomcat的工作原理1.3、Tomcat适用的场景1.4、Tomcat与Nginx、Apache比较1.4.1、优势1.4.2、劣势1.4.3、定位功能1.5、Tomcat的主要组件1.6、Tomcat的主要配置文件二、Tomcat安装2.1、查看可用的JDK2.2、安装OpenJDK112.3、配置环境变量2.4、验证安装2.5、查
  • linux环境下tomcat安装 M.za linuxtomcat运维服务器
    Tomcat一、什么是Tomcat？1.1、Tomcat介绍Tomcat又叫ApacheTomcat最早是sun公司开发的，1999年捐献给apache基金会，隶属于雅加达项目，现在已经独立成一个顶级项目，因为tomcat技术先进，性能稳定，又是一个开源的web应用服务器，所以很多企业都在使用，很多Java开发者也在使用，开发调试jsp的首选，被更多企业用于Java容器。Tomcat官网：http
  • HarmonyOS 入门到精通：为什么状态管理是鸿蒙开发的核心？ 逻极 harmonyos鸿蒙笔记harmonyos华为鸿蒙入门到精通状态管理状态模式arkts
    在现代应用开发中，状态管理是构建响应式应用的基石。对于鸿蒙这种面向全场景的分布式操作系统，状态管理机制显得尤为重要。它不仅是实现复杂交互逻辑的关键，还直接关系到应用的性能、可维护性和用户体验。什么是状态管理？状态是指UI组件所依赖的、会随时间变化的数据。状态管理则是对这些变化数据的有效组织和控制，包括：状态的创建与初始化：在应用启动或组件加载时，为状态变量分配初始值，确保组件能够正确渲染初始界面。
  • 4.服务注册发现：微服务的神经系统
    在微服务架构中，服务之间不再是固定连接，而是高度动态、短暂存在的。如何让每个服务准确找到彼此，是分布式系统治理的核心问题之一。服务注册发现机制，正如神经系统之于人体，承担着连接、协调、感知变化的关键角色。本文将围绕Netflix开源的服务注册发现组件Eureka展开，深入剖析其原理，并以SpringCloud实战为导向，帮助你掌握服务治理的第一步。一、为什么需要服务注册发现？在单体架构中，服务调用
  • 2.Spring Cloud生态全景解析：核心组件、能力边界与定位 碎风影 SpringCloud深度解析springcloudspring后端
    导语：SpringCloud并非单一框架，而是基于SpringBoot构建的分布式系统工具集。它通过标准化封装，将服务发现、配置管理、熔断限流等复杂基础设施转化为开箱即用的组件，让开发者聚焦业务逻辑。本文将系统解析其核心组成、与SpringBoot的共生关系，并客观审视其能力边界，助您构建清晰的微服务技术选型地图。一、核心基石：SpringBoot与SpringCloud的共生关系关键结论：Spr
  • Web端版本更新提示--前端处理 扶我起来还能学_ 前端javascriptvue.js前端框架
    Web端版本更新提示–前端处理原理：webpack每次打包jshash值不同import{MessageBox}from'element-ui'letlastScripts=[]//最新一次js文件src名constDURATION=5*60*1000//设置5分钟检查更新一次//提取html中的script标签的src属性asyncfunctionextractNewScripts(htmlSt
  • spring-data-jpa+spring+hibernate+druid配置
    参考链接：http://doc.okbase.net/liuyitian/archive/109276.htmlhttp://my.oschina.net/u/1859292/blog/312188最新公司的web项目需要用到spring-data-jpa作为JPA的实现框架，同时使用阿里巴巴的开源数据库连接池druid。关于这两种框架的介绍我在这里就不多赘述。直接进入配置页面：spring的配置
  • 服务注册和发现组件的详细对比与选型建议（详细版） 古龙飞扬 springcloudspring后端
    服务注册和发现组件Eureka、Consul、ZooKeeper、Etcd和Nacos的区别与选型建议在微服务架构中，服务注册与发现是一个核心组件，它解决了服务实例的动态管理和自动发现的问题。目前，市场上存在多种服务注册与发现组件，其中Eureka、Consul、ZooKeeper、Etcd和Nacos较为常见。作为资深的软件架构师，本文将详细分析这些组件的区别，并提供选型建议。一、EurekaE
  • vue3 + element-plus el-table表格二次封装，支持复选框，排序，分页。 前端vue.js
    一、customTable.vue组件{{(currentPage-1)*pageSize+scope.$index+1}}{{btn.text}}import{ref,onMounted}from"vue";letloading=defineModel("loading");constemits=defineEmits(["selection-change","sort-change"]);co
  • JavaScript中的系统对话框：alert、confirm、prompt
    JavaScript中的系统对话框：alert、confirm、prompt在Web开发的世界里，JavaScript始终扮演着“桥梁”的角色——它连接用户与网页，让静态的页面焕发活力。而在这座桥梁上，系统对话框（SystemDialogs）是最基础却最实用的工具之一。它们像是一位贴心的助手，在用户需要确认、提示或输入时，悄然出现，又在任务完成后无声退场。今天，我们就来聊聊JavaScript中三
  • 深入剖析开源AI阅读器项目Saga Reader基于大模型的文本转换与富文本渲染优化方案 魑魅丶小鬼 人工智能
    引言AI阅读器作为一种新型的内容消费工具，正在改变人们获取和处理信息的方式。本文将介绍SagaReader项目中如何利用大型语言模型(LLM)进行网页内容抓取、智能优化和富文本渲染，特别是如何通过精心设计的提示词(prompt)引导LLM生成样式丰富的HTML内容，提升用户阅读体验。关于SagaReader基于Tauri开发的著名开源AI驱动的智库式阅读器（前端部分使用Web框架），能根据用户指定
  • Nginx中如何配置WebSocket代理？ m0_74824025 面试学习路线阿里巴巴nginxwebsocket运维
    Nginx可以配置为WebSocket代理，将WebSocket连接从客户端转发到后端服务器。以下是如何在Nginx中配置WebSocket代理的详细步骤和示例配置。1.安装Nginx确保你已经安装了Nginx。如果没有安装，可以使用以下命令进行安装：sudoapt-getupdatesudoapt-getinstallnginx2.配置WebSocket代理编辑Nginx配置文件，通常位于/et
  • Nginx代理websocket连接 为什么要做囚徒 nginxnginxwebsocket运维
    文章目录Nginx代理websocket连接1.引言2.为什么需要Nginx代理WebSocket3.Nginx代理WebSocket的实现步骤步骤1：确保Nginx支持WebSocket步骤2：修改Nginx配置文件步骤3：重启Nginx服务步骤4：验证配置Nginx代理websocket连接1.引言WebSocket是一种在单个TCP连接上进行全双工通讯的协议，它在Web应用程序中提供了实时通
  • Python Selenium 使用指南
    Selenium是一个用于自动化Web浏览器交互的强大工具，常用于网页测试、数据抓取和自动化任务。以下是Python中Selenium的详细使用说明。安装Selenium首先需要安装Selenium库和浏览器驱动：pipinstallselenium然后下载对应浏览器的驱动：Chrome:ChromeDriverFirefox:GeckoDriverEdge:EdgeDriver将驱动放在系统PA
  • 04_JavaWeb回顾笔记 skping-go javajavaweb
    JavaWeb回顾笔记[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Wh1nKopi-1605668744709)(F:\资料\Java\笔记\笔记\assets\javaweb阶段知识体系.png)]Day01HTML1.1HTML简介HTML：HyperTextMarkupLanguage，超文本标记/标签语言。超文本:超出了普通文本的能力标记:标签W3C(Wo
  • 最实用的selenium使用指南
    selenium使用一环境搭建下载seleniumpipinstallselenium下载浏览器驱动（以Edge为例）在设置中找到当前Edge版本号，在[MicrosoftEdgeWebDriver-MicrosoftEdgeDeveloper](https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/)中下载对应版
  • Selenium使用指南
    点击文末小卡片，免费获取软件测试全套资料，资料在手，涨薪更快Selenium是网页应用中最流行的自动化测试工具，可以用来做自动化测试或者浏览器爬虫等。官网地址为：相对于另外一款web自动化测试工具QTP来说有如下优点：免费开源轻量级，不同语言只需要一个体积很小的依赖包支持多种系统，包括Windows，Mac，Linux支持多种浏览器，包括Chrome，FireFox，IE，safari，opera
  • Softhub软件下载站实战开发（十四）：软件收藏集设计 叹一曲当时只道是寻常 softHub前端golang
    文章目录Softhub软件下载站实战开发（十四）：软件收藏集设计引言：为什么我们需要收藏集功能？收藏集功能的核心价值1.资源整合与分类管理技术架构设计数据库设计核心接口设计后端实现详解1.收藏集服务层2.列表查询实现3.添加软件实现前端实现详解1.收藏集列表页面2.软件管理弹窗组件3.软件选择与添加逻辑Softhub软件下载站实战开发（十四）：软件收藏集设计前面几篇我们讲了软件管理相关实现，本篇我
  • Softhub软件下载站实战开发（一）：项目总览 叹一曲当时只道是寻常 softHubgo
    文章目录Softhub软件下载站实战开发（一）：项目总览项目介绍技术栈选择关键组件功能列表Softhub软件下载站实战开发（一）：项目总览项目介绍在数字化浪潮席卷全球的今天，软件已成为我们工作和生活的核心工具。然而，当我们尝试从传统软件下载站获取所需工具时，常常陷入这样的困境：用户下载需求传统下载站满屏闪烁广告隐藏的捆绑安装已下载的软件不好归档误点下载器陷阱被强制安装垃圾软件重新下载本项目无法解决
  • 使用ENO将您的JSON对象生成HTML显示 土族程序员 jsonhtmljavascripteno前端
    ENO是简单易用，性能卓越，自由灵活开源的WEB前端组件；实现JSON与HTML互操作的JavaScript函数库。没有任何其它依赖，足够轻量。WEBPackNPM工程安装。npminstall@joyzl/eno然后在JS中引用import"@joyzl/eno";将JS实体对象填充到表单假设有一个如下的HTML表单TYPE1TYPE2通过以下代码将实体对象，设置到表单中，实体对象可以从服务器请
  • Android MVVM架构与数据绑定：深入实战与技巧 码上有潜 笔记本android架构
    AndroidMVVM架构与数据绑定：深入实战与技巧MVVM（Model-View-ViewModel）模式是Android开发中常用的一种高效架构模式，尤其是在结合Android架构组件时，可以极大简化代码结构和提高可维护性。本篇博文将带你深入了解MVVM架构的原理与**数据绑定（DataBinding）**技术，提供丰富的代码示例，帮助你从基础掌握到高级实战。1.MVVM架构概述MVVM架构模
  • 更新！「3D Web轻量化引擎」HOOPS Communicator发布2025.2.0版本：全新WebViewer用户界面、 工业3D_大熊 3DCAD开发工具3d3D建模3D模型轻量化工业3D3D数据格式转换3D模型可视化3DWeb轻量化
    3DWeb轻量化引擎HOOPSCommunicator此前发布2025.2.0版本！此次更新聚焦于提升用户体验和稳定性，通过引入创新的界面设计以及对若干问题的修复，确保用户能够更加高效、流畅地处理3D数据可视化任务。以下将详细阐述本次更新的核心内容。一、增强功能本次更新的重点在于对WebViewer用户界面的革新。我们精心打造了全新的WebViewerUI，其核心基于WebComponents技术
  • CTFSHOW-WEB-36D杯 wyjcxyyy 前端android
    给你shell这道题对我这个新手还是有难度的，花了不少时间。首先f12看源码，看到?view_source，点进去看源码location.href=\'./index.php\'');if(!isset($_GET['code'])){show_source(__FILE__);exit();}else{$code=$_GET['code'];if(!preg_match($secret_waf,
  • 【Java源码阅读系列44】深度解读Java NIO ByteBuffer 源码 ·云扬· 源码阅读系列之Javajavanio开发语言
    JavaNIO（NewInput/Output）中的ByteBuffer是Buffer抽象类的具体子类，专门用于处理字节数据的高效读写。作为NIO的核心组件，ByteBuffer支持堆内存（Heap）和直接内存（Direct）两种存储方式，广泛应用于网络通信、文件IO等场景。本文将结合源码，深入解析ByteBuffer的核心机制、关键方法及设计模式的应用。一、ByteBuffer的核心特性与存储方
  • 前端自动化测试最佳实践：Jest与Cypress详解
    目录前言自动化测试概述Jest详解Jest基础配置单元测试实践组件测试Mock与Stub快照测试Cypress详解Cypress环境搭建端到端测试实践页面交互测试API模拟测试策略与最佳实践测试金字塔测试覆盖率持续集成常见问题与解决方案总结前言随着前端应用的复杂度不断提高，确保代码质量和稳定性变得越来越重要。自动化测试作为保障代码质量的重要手段，已成为现代前端开发流程中不可或缺的一环。本文将详细介
  • Web 前端性能优化：从代码到加载速度的全面剖析 码力无边-OEC 前端性能优化web
    Web前端性能优化：从代码到加载速度的全面剖析当用户访问你的网站时，如果页面加载时间超过3秒，跳出率会飙升至40%以上。更糟糕的是，移动端用户的耐心只有2秒。这意味着性能优化不仅仅是技术问题，更直接关系到业务成果。经过多年的前端开发实践，我发现很多开发者在性能优化时存在一个误区：过分关注工具和框架的选择，却忽略了最基础但最关键的优化策略。今天我们就来深入剖析前端性能优化的核心要点。性能优化的核心指
  • OpenWebUI(8)源码学习-后端utils/telemetry追踪遥测模块
    目录目录结构说明`constants.py`核心作用：主要功能：示例代码片段：`exporters.py`核心作用：主要类：`LazyBatchSpanProcessor`特点：技术亮点：`instrumentors.py`核心作用：插桩对象包括：钩子函数（Hooks）：Instrumentor类：插桩流程：`setup.py`核心作用：主要功能：典型调用方式：✨总体架构与价值技术亮点总结✅开发建
  • 抓包工具fiddler详细使用教程 金丝猴也是猿 httpudphttpswebsocket网络安全网络协议tcp/ip
    抓包工具的使用技巧与配置指南各位做测试的同学想必对抓包工具并不陌生，Fiddler是大家常用的工具之一，但除了Fiddler，还有一款功能强大的抓包工具——SniffMaster（抓包大师），它在某些场景下表现尤为出色。今天我们将结合Fiddler和SniffMaster的使用技巧，为大家提供一份全面的抓包配置指南。Web端抓包配置Fiddler的HTTPS配置打开Fiddler，进入Tools-
  • FastAPI依赖注入：构建高可维护API的核心理念与实战 源滚滚AI编程 fastapilog4j
    依赖注入（DependencyInjection,DI）作为FastAPI的核心设计模式，通过解耦组件依赖关系、提升代码复用性和可测试性，已成为现代API开发的基石。本文将深入解析其工作原理、高级特性及企业级应用场景。一、依赖注入的核心价值解耦与模块化将数据库连接、认证逻辑等基础设施与业务逻辑分离，避免代码冗余。示例：路由函数无需手动创建数据库连接，通过Depends(get_db)自动注入[ci
  • web后端框架MyBatis 猿力觉醒 java后端mybatis
    目录前言1.xml配置方式开发步骤2.注解方式开发步骤前言mybatis是一个优秀的基于java的持久层框架，它内部封装了jdbc，使开发者只需要关注sql语句本身，而不需要花费精力去处理加载驱动、创建连接、创建statement等繁杂的过程。mybatis通过xml或注解的方式将要执行的各种statement配置起来，并通过java对象和statement中sql的动态参数进行映射生成最终执行的
  • PHP如何实现二维数组排序？ IT独行者 二维数组PHP排序　
    二维数组在PHP开发中经常遇到，但是他的排序就不如一维数组那样用内置函数来的方便了，（一维数组排序可以参考本站另一篇文章【PHP中数组排序函数详解汇总】）。二维数组的排序需要我们自己写函数处理了，这里UncleToo给大家分享一个PHP二维数组排序的函数： 代码： functionarray_sort($arr,$keys,$type='asc'){ $keysvalue= $new_arr
  • 【Hadoop十七】HDFS HA配置 bit1129 hadoop
    基于Zookeeper的HDFS HA配置主要涉及两个文件,core-site和hdfs-site.xml。   测试环境有三台 hadoop.master hadoop.slave1 hadoop.slave2   hadoop.master包含的组件NameNode, JournalNode, Zookeeper，DFSZKFailoverController
  • 由wsdl生成的java vo类不适合做普通java vo darrenzhu VOwsdlwebservicerpc
    开发java webservice项目时，如果我们通过SOAP协议来输入输出，我们会利用工具从wsdl文件生成webservice的client端类，但是这里面生成的java data model类却不适合做为项目中的普通java vo类来使用，当然有一中情况例外，如果这个自动生成的类里面的properties都是基本数据类型，就没问题，但是如果有集合类，就不行。原因如下： 1)使用了集合如Li
  • JAVA海量数据处理之二（BitMap） 周凡杨 java算法bitmapbitset数据
           路漫漫其修远兮，吾将上下而求索。想要更快，就要深入挖掘 JAVA 基础的数据结构，从来分析出所编写的 JAVA 代码为什么把内存耗尽，思考有什么办法可以节省内存呢？ 啊哈！算法。这里采用了 BitMap 思想。   首先来看一个实验： 指定 VM 参数大小： -Xms256m -Xmx540m
  • java类型与数据库类型 g21121 java
    很多时候我们用hibernate的时候往往并不是十分关心数据库类型和java类型的对应关心，因为大多数hbm文件是自动生成的，但有些时候诸如：数据库设计、没有生成工具、使用原始JDBC、使用mybatis(ibatIS)等等情况，就会手动的去对应数据库与java的数据类型关心，当然比较简单的数据类型即使配置错了也会很快发现问题，但有些数据类型却并不是十分常见，这就给程序员带来了很多麻烦。 &nb
  • Linux命令 510888780 linux命令
    系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS / DMI) hdparm -i /dev/hda 罗列一个磁盘的架构特性 hdparm -tT /dev/sda 在磁盘上执行测试性读取操作 cat /proc/cpuinfo 显示C
  • java常用JVM参数 墙头上一根草 javajvm参数
    -Xms：初始堆大小，默认为物理内存的1/64(<1GB)；默认(MinHeapFreeRatio参数可以调整)空余堆内存小于40%时，JVM就会增大堆直到-Xmx的最大限制 -Xmx：最大堆大小，默认(MaxHeapFreeRatio参数可以调整)空余堆内存大于70%时，JVM会减少堆直到 -Xms的最小限制 -Xmn：新生代的内存空间大小，注意：此处的大小是（eden+ 2
  • 我的spring学习笔记9-Spring使用工厂方法实例化Bean的注意点 aijuans Spring 3
    方法一： <bean id="musicBox" class="onlyfun.caterpillar.factory.MusicBoxFactory" factory-method="createMusicBoxStatic"></bean> 方法二：
  • mysql查询性能优化之二 annan211 UNIONmysql查询优化索引优化
    1 union的限制 有时mysql无法将限制条件从外层下推到内层，这使得原本能够限制部分返回结果的条件无法应用到内层 查询的优化上。 如果希望union的各个子句能够根据limit只取部分结果集，或者希望能够先排好序在 合并结果集的话，就需要在union的各个子句中分别使用这些子句。 例如 想将两个子查询结果联合起来，然后再取前20条记录，那么mys
  • 数据的备份与恢复 百合不是茶 oraclesql数据恢复数据备份
     数据的备份与恢复的方式有: 表,方案 ,数据库;     数据的备份: 导出到的常见命令; 参数 说明 USERID 确定执行导出实用程序的用户名和口令 BUFFER 确定导出数据时所使用的缓冲区大小，其大小用字节表示 FILE 指定导出的二进制文
  • 线程组 bijian1013 java多线程threadjava多线程线程组
    有些程序包含了相当数量的线程。这时，如果按照线程的功能将他们分成不同的类别将很有用。        线程组可以用来同时对一组线程进行操作。        创建线程组：ThreadGroup g = new ThreadGroup(groupName);  &nbs
  • top命令找到占用CPU最高的java线程 bijian1013 javalinuxtop
    上次分析系统中占用CPU高的问题，得到一些使用Java自身调试工具的经验，与大家分享。 (1)使用top命令找出占用cpu最高的JAVA进程PID:28174 (2)如下命令找出占用cpu最高的线程 top -Hp 28174 -d 1 -n 1 32694 root 20 0 3249m 2.0g 11m S 2 6.4 3:31.12 java
  • 【持久化框架MyBatis3四】MyBatis3一对一关联查询 bit1129 Mybatis3
      当两个实体具有1对1的对应关系时，可以使用One-To-One的进行映射关联查询   One-To-One示例数据 以学生表Student和地址信息表为例，每个学生都有都有1个唯一的地址(现实中，这种对应关系是不合适的，因为人和地址是多对一的关系)，这里只是演示目的   学生表   CREATE TABLE STUDENTS (
  • C/C++图片或文件的读写 bitcarter 写图片
    先看代码： /*strTmpResult是文件或图片字符串 * filePath文件需要写入的地址或路径 */ int writeFile(std::string &strTmpResult,std::string &filePath) { int i,len = strTmpResult.length(); unsigned cha
  • nginx自定义指定加载配置 ronin47
    进入 /usr/local/nginx/conf/include 目录，创建 nginx.node.conf 文件，在里面输入如下代码： upstream nodejs { server 127.0.0.1:3000; #server 127.0.0.1:3001; keepalive 64; } server { liste
  • java-71-数值的整数次方.实现函数double Power(double base, int exponent)，求base的exponent次方 bylijinnan double
    public class Power { /** *Q71-数值的整数次方 *实现函数double Power(double base, int exponent)，求base的exponent次方。不需要考虑溢出。 */ private static boolean InvalidInput=false; public static void main(
  • Android四大组件的理解 Cb123456 android四大组件的理解
     分享一下，今天在Android开发文档-开发者指南中看到的:                            App components are the essential building blocks of an Android
  • [宇宙与计算]涡旋场计算与拓扑分析 comsci 计算
         怎么阐述我这个理论呢？ 。。。。。。。。。       首先： 宇宙是一个非线性的拓扑结构与涡旋轨道时空的统一体。。。。       我们要在宇宙中寻找到一个适合人类居住的行星，时间非常重要，早一个刻度和晚一个刻度，这颗行星的
  • 同一个Tomcat不同Web应用之间共享会话Session cwqcwqmax9 session
    实现两个WEB之间通过session 共享数据 查看tomcat 关于 HTTP Connector 中有个emptySessionPath 其解释如下： If set to true, all paths for session cookies will be set to /. This can be useful for portlet specification impleme
  • springmvc Spring3 MVC，ajax，乱码 dashuaifu springjquerymvcAjax
      springmvc Spring3 MVC @ResponseBody返回，jquery ajax调用中文乱码问题解决   Spring3.0 MVC @ResponseBody 的作用是把返回值直接写到HTTP response body里。具体实现AnnotationMethodHandlerAdapter类handleResponseBody方法，具体实
  • 搭建WAMP环境 dcj3sjt126com wamp
    这里先解释一下WAMP是什么意思。W:windows，A：Apache，M：MYSQL，P：PHP。也就是说本文说明的是在windows系统下搭建以apache做服务器、MYSQL为数据库的PHP开发环境。      工欲善其事，必须先利其器。因为笔者的系统是WinXP，所以下文指的系统均为此系统。笔者所使用的Apache版本为apache_2.2.11-
  • yii2 使用raw http request dcj3sjt126com http
    Parses a raw HTTP request using yii\helpers\Json::decode()   To enable parsing for JSON requests you can configure yii\web\Request::$parsers using this class: 'request' =&g
  • Quartz-1.8.6 理论部分 eksliang quartz
    转载请出自出处：http://eksliang.iteye.com/blog/2207691 一.概述 基于Quartz-1.8.6进行学习，因为Quartz2.0以后的API发生的非常大的变化，统一采用了build模式进行构建； 什么是quartz?   答：简单的说他是一个开源的java作业调度框架，为在 Java 应用程序中进行作业调度提供了简单却强大的机制。并且还能和Sp
  • 什么是POJO？ gupeng_ie javaPOJO框架Hibernate
    POJO--Plain Old Java Objects(简单的java对象)   POJO是一个简单的、正规Java对象，它不包含业务逻辑处理或持久化逻辑等，也不是JavaBean、EntityBean等，不具有任何特殊角色和不继承或不实现任何其它Java框架的类或接口。   POJO对象有时也被称为Data对象，大量应用于表现现实中的对象。如果项目中使用了Hiber
  • jQuery网站顶部定时折叠广告 ini JavaScripthtmljqueryWebcss
    效果体验：http://hovertree.com/texiao/jquery/4.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>网页顶部定时收起广告jQuery特效 - HoverTree<
  • Spring boot内嵌的tomcat启动失败 kane_xie spring boot
    根据这篇guide创建了一个简单的spring boot应用，能运行且成功的访问。但移植到现有项目（基于hbase）中的时候，却报出以下错误：     SEVERE: A child container failed during start java.util.concurrent.ExecutionException: org.apache.catalina.Lif
  • leetcode: sort list michelle_0916 Algorithmlinked listsort
    Sort a linked list in O(n log n) time using constant space complexity. ====analysis======= mergeSort for singly-linked list  ====code=======   /** * Definition for sin
  • nginx的安装与配置,中途遇到问题的解决 qifeifei nginx
    我使用的是ubuntu13.04系统，在安装nginx的时候遇到如下几个问题，然后找思路解决的，nginx 的下载与安装   wget http://nginx.org/download/nginx-1.0.11.tar.gz tar zxvf nginx-1.0.11.tar.gz ./configure make make install   安装的时候出现
  • 用枚举来处理java自定义异常 tcrct javaenumexception
    在系统开发过程中，总少不免要自己处理一些异常信息，然后将异常信息变成友好的提示返回到客户端的这样一个过程，之前都是new一个自定义的异常，当然这个所谓的自定义异常也是继承RuntimeException的，但这样往往会造成异常信息说明不一致的情况，所以就想到了用枚举来解决的办法。 1，先创建一个接口，里面有两个方法，一个是getCode, 一个是getMessage public
  • erlang supervisor分析 wudixiaotie erlang
    当我们给supervisor指定需要创建的子进程的时候，会指定M,F,A,如果是simple_one_for_one的策略的话，启动子进程的方式是supervisor:start_child(SupName, OtherArgs),这种方式可以根据调用者的需求传不同的参数给需要启动的子进程的方法。和最初的参数合并成一个数组，A ++ OtherArgs。那么这个时候就有个问题了，既然参数不一致，那
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他