kikay
kikay

Bootstrap学习总结笔记（16）-- 基本插件之模态对话框

Bootstrap自带了很多JQuery插件，给用户做前端开发提供了很大的方便。对于每一个插件，有2种引用方式：一是单独引用，即使用Bootstrap的单独*.js文件，这种方式需要注意的是一些插件和CSS组件可能依赖其他插件，所以单独引用的时候，需要弄清楚这种包含关系一并引用；二是直接引用完整的bootstrap.js或者压缩版的bootstrap.min.js，需要注意的是不能同时引用这2个文件。
Bootstrap自带了很多基本的插件，包括模态对话框、标签切换、Tooltip提示工具等。首先来总结下模态对话框的使用。

0x01基本样式

模态框（Modal）是覆盖在父窗体上的子窗体。通常，目的是显示来自一个单独的源的内容，可以在不离开父窗体的情况下有一些互动。子窗体可提供信息、交互等。Bootstrap Modals（模态框）是使用定制的JQuery插件创建的。它可以用来创建模态窗口丰富用户体验，或者为用户添加实用功能。
下面是一个基本样式：


<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="../../css/bootstrap.min.css" rel="stylesheet">
    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js">script>
    <script src="../../js/bootstrap.min.js">script>
    <title>模态对话框title>
head>
<body>
<div class="container">
    <div class="page-header">
        <h1>模态对话框基本h1>
    div>
    <button type="button" id="Open" class="btn btn-primary btn-lg btn-mymodal" data-toggle="modal"
            data-target="#myModal">
        打开模态框
    button>
    <div class="modal fade" id="myModal" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×button>
                    <h4 class="modal-title" id="myModalLabel">标题h4>
                div>
                <div class="modal-body">内容内容内容内容div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭button>
                    <button type="button" class="btn btn-primary">提交button>
                div>
            div>
        div>
    div>
div>
body>
html>

效果如下：

Bootstrap学习总结笔记（16）-- 基本插件之模态对话框_第1张图片

几点说明：

（1）使用模态窗口，需要有某种触发器，可以使用按钮或链接。这里我们使用的是按钮。
（2）data-target="#myModal" 是想要在页面上加载的模态框的目标。
（3）在模态框中需要注意两点：一是.modal，用来把

的内容识别为模态框；二是 .fade class。当模态框被切换时，它会引起内容淡入淡出。
（4）
，modal-header 是为模态窗口的头部定义样式的类。
（5）class="close"，close 是一个 CSS class，用于为模态窗口的关闭按钮设置样式。
（6）data-dismiss="modal"，是一个自定义的 HTML5 data 属性。在这里它被用于关闭模态窗口。
（7）class="modal-body"，是 Bootstrap CSS 的一个 CSS class，用于为模态窗口的主体设置样式。
（8）class="modal-footer"，是 Bootstrap CSS 的一个 CSS class，用于为模态窗口的底部设置样式。
（9）data-toggle="modal"，HTML5 自定义的 data 属性 data-toggle 用于打开模态窗口。

0x02 JS方式加载

除了上面通过属性方式加载外，还可以通过JS方式加载模态对话框，下面是一个用户登录界面的简单实现：


<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="../../css/bootstrap.min.css" rel="stylesheet">
    <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js">script>
    <script src="../../js/bootstrap.min.js">script>
    <style>
        .col-center-block{
            float: none;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }
    style>
    <title>js加载例子title>
head>
<body>
<div class="container">
    <div class="page-header">
        <h1>js加载模态对话框h1>
    div>
    <div>
        <button type="button" class="btn btn-lg btn-primary btn-myModal" data-toggle="modal">弹出对话框button>
        <div id="myModal" class="modal fade">
            <div class="modal-dialog" style="width: 20%">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×button>
                        <h4 class="modal-title">用户登录h4>
                    div>
                    <div class="modal-body">
                        <div>
                            <form>
                                <div class="form-group">
                                    <label class="control-label" for="UserName">用户名label>
                                    <input type="text" class="form-control" id="UserName" placeholder="用户名">
                                div>
                                <div class="form-group">
                                    <label class="control-label" for="Password">密码label>
                                    <input type="password" class="form-control" id="Password" placeholder="密码">
                                div>
                                <div class="form-group">
                                    <label>
                                        <input type="checkbox"> 下次自动登录
                                    label>
                                    <a href="#" class="pull-right">忘记密码a>
                                div>
                                <div class="form-group">
                                    <button type="submit" class="btn btn-primary form-control">登录button>
                                div>
                            form>
                        div>
                    div>
                div>
            div>
        div>
    div>
div>
<script>
    $(function () {
        $(".btn-myModal").click(function () {
            $("#myModal").modal({
                keyboard:true,
//                remote:"../Alerts.html"
            })
        })
        $("#myModal").on("hidden.bs.modal",function () {
//            alert('test');
        })
    })
script>
body>
html>

效果如下：

Bootstrap学习总结笔记（16）-- 基本插件之模态对话框_第2张图片

上面的例子包含了JS加载modal的过程，也包括了设置模态对话框宽度、响应事件等内容。modal方法结合一些参数来实现特殊效果：
（1）把内容作为模态框激活。接受一个可选的选项对象：

$("#myModal").modal({
keyboard:true,
})

（2）状态切换

$("#myModal").modal('toggle')  //手动打开模态框。
$("#myModal").modal('hide')   //手动隐藏模态框。

0x03 事件

Bootstrap模态对话框还定义了事件，通过“钩子”的方式调用：

（1）show.bs.modal
在调用 show 方法后触发：

$('#myModal').on('show.bs.modal', function () {
  // 执行一些动作...
})

（2）shown.bs.modal
当模态框对用户可见时触发（将等待 CSS 过渡效果完成）： 

$('#myModal').on('shown.bs.modal', function () {
  // 执行一些动作...
})

（3）hide.bs.modal
当调用 hide 实例方法时触发：

$('#myModal').on('hide.bs.modal', function () {
  // 执行一些动作...
})

（4）hidden.bs.modal
当模态框完全对用户隐藏时触发：

$('#myModal').on('hidden.bs.modal', function () {
  // 执行一些动作...
})

上面用户登录的例子中事件部分代码：

$("#myModal").on("hidden.bs.modal",function () {
      alert('test');
  })

当模态框完全对用户隐藏时，就会调用执行这段JS代码。

你可能感兴趣的:(Bootstrap,bootstrap,模态对话框)

  • Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程） 王佳斌 +Thinkphpmysql前端数据库
    前言登录功能，是我们几乎开发每个系统都必须的模块。登录功能设计思路，主要包括几个方面。用户输入网址展示登录页面用户输入用户名，密码等点击登录进行信息校验校验通过之后，记录用户登录信息，跳转指定页面用户校验失败，提示失败信息页面目录具体功能实现为了快速搭建可用、美观的页面，我们采用一个比较成熟的前端框架Bootstrap。下面我们到Bootstrap的官网Bootsrap官网下载bootstrap。
  • 程序员开发技术整理 laizhixue 学习前端框架
    前端技术：vue-前端框架element-前端框架bootstrap-前端框架echarts-图标组件C#后端技术：webservice：soap架构：简单的通信协议，用于服务通信ORM框架：对象关系映射，如EF：对象实体模型，是ado.net中的应用技术soap服务通讯：xml通讯ado.net：OAuth2:登录授权认证：Token认证：JWT：jsonwebtokenJava后端技术：便捷工
  • SuperProductivity学习第七天-src/main.ts学习 一个三分钟热度的人 SuperProductivity学习经验分享笔记其他electronangular
    方法1.你的问题是什么，请描述出来，描述具体。2.解决你的问题后，是否记住，能否记住和表达出来，不能的话就重复性记忆。3.是否有的时候很烦躁，心很乱，思想飘絮，那就总结，今天干了点什么，要干点什么，明天干点什么，这周干了什么。4.保持干净，环境的干净和自身和干净，比如桌子，比如衣服，带来一个好的状态讲解src/main.tsplatformBrowserDynamic().bootstrapMod
  • 【吊打面试官系列】Java虚拟机JVM篇 - 关于双亲委派模型 java1234_小锋 javajavajvmjvm面试题java面试题jvm虚拟机双亲委派模型
    大家好，我是锋哥。今天分享关于JVM双亲委派模型的JVM面试题，希望对大家有帮助；什么是双亲委派模型？双亲委派模型针对的是Java虚拟机中三个类加载器的，这三个类加载器分别是：启动类加载器（BootstrapClassLoader）扩展类加载器（ExtensionClassLoader）应用程序类加载器（ApplicationClassLoader）如下图所示：上面这几类类加载器构成了不同的层次结
  • Flask中session失效时间设置 忘了呼吸的那只猫
    最近需要使用Python开发web系统，主要用到的框架就是Flask，前端使用Jinja2模板引擎和Bootstrap，web容器使用Cherrypy，其中关于Login管理的使用了Flask-Login插件。基本上也是从零学起，前前后后花了有好几个月的时间，还是在借鉴了已有的一些项目基础上。在开发的过程中有很多的想法和体会，记录下来，有不对的地方欢迎大家指正。在处理登录管理的部分，在Flask-
  • Netty架构详解 思静语 Netty网络通信
    文章目录概述整体结构Netty的核心组件逻辑架构BootStrap&ServerBootStrapChannelPipelineFuture、回调和ChannelHandler选择器、事件和EventLoopChannelHandler的各种ChannelInitializer类图ProtocolSupport协议支持层TransportService传输服务层Core核心层模块netty-com
  • Python pip包管理工具 大器待成
    pip是Python包管理工具，该工具提供了对Python包的查找、下载、安装、卸载的功能。Python2.7.9+或Python3.4+以上版本都自带pip工具。pip安装通过以下命令验证是否已安装：pip--version如果你还未安装，则可以使用以下方法来安装：$curlhttps://bootstrap.pypa.io/get-pip.py-oget-pip.py#下载安装脚本$sudop
  • 【吊打面试官系列】Java虚拟机JVM篇 - 关于类加载器的JVM面试题 java1234_小锋 javajavajvmjava虚拟机jvm面试题java面试题
    大家好，我是锋哥。今天分享关于类加载器的JVM面试题，希望对大家有帮助；什么是类加载器？类加载器是一个用来加载类文件的类。Java源代码通过javac编译器编译成类文件。然后JVM来执行类文件中的字节码来执行程序。类加载器负责加载文件系统、网络或其他来源的类文件。类加载器有哪些？有三种默认使用的类加载器：Bootstrap类加载器、Extension类加载器和Application类加载器。每种类
  • springboot 连kafka 发，接消息 Perfect珈蓝 springbootkafkalinq
    引入pomorg.apache.kafkakafka_2.133.7.0org.springframework.kafkaspring-kafka增加yml配置spring:kafka:bootstrap-servers:192.168.1.30:9092consumer:group-id:testack-mode:manual#生产者producer:key-serializer:org.apa
  • eBPF实践篇之环境搭建 醉墨居士 eBPFlinux网络c语言
    文章目录前言实验环境前置知识配置开发环境最后前言你好，我是醉墨居士，本次我们学习一下eBPF，我们基于libbpf-bootstrap来进行我们的eBPF程序开发实验环境一台Debian12操作系统的计算机，我使用的是Debian12.2.0-amd64其它Linux发行版的环境也可以，Linux内核不低于5.4版本前置知识c语言，linux系统基本操作配置开发环境在Ubuntu/Debian系统
  • 大二下学期总结 任世伟_三月
    一、阶段本学期在校期间完成了个3阶段：PS、JS（除了两个月时间外，都在阶段时间内）、Bootstrap+jQuery。二、其余学习1.英语。开始了日常的英语学习，但效果还不行，后续需加强，现在不足以应对四级考试（兴趣不足、“主因”——坚持艰难、刷题）。2.算法。采取“趣学算法”（学习思想）+完成实际算法题（实战）的模式。3.专业课。一学期几乎未听课，依靠考前突击。三、运动注意身体健康，喝酒有害身
  • netty的TCP服务端和客户端实现 nanshaws tcp/ipudp网络netty后端服务器
    第一步：引入依赖io.nettynetty-all4.1.90.Final第二步：实现TCP服务端packageorg.cyl.tcputils;importio.netty.bootstrap.ServerBootstrap;importio.netty.channel.ChannelFuture;importio.netty.channel.ChannelInitializer;importi
  • 基于SSM实现的支教管理系统 全栈小白. Java全栈开发系统源码javatomcatspringmybatis
    文章目录系统介绍技术选型成果展示账号地址及其他说明系统介绍基于SSM实现的支教管理系统分为前台和后台管理系统，系统共有超级管理员，系统管理员，支教学校，志愿者这四大类角色，不同角色具有不同的功能。前端采用最新扁平化的框架bootstrap实现。后台管理系统实现了超级管理员管理、普通管理员管理、支教学校管理、志愿者管理、报名审核、职位管理、网站设置、评论管理、以及留言管理前台分为支教学校和志愿者两种
  • 使用bootstrap实现多选下拉框，获取值及绑定值 落叶@Henry html5javascriptcss前端
    源码我在文末提供实现的效果图如下代码：Document西瓜香蕉橙子牛奶猕猴桃梨苹果按钮$("#btnadd").click(function(){alert($("#sel").val());});$(function(){letoptions=$("#sel>option");letsels="6,7,8".split(',');varlist_val=['1','2','3','5']$('#
  • 【退役之重学前端】使用vite+vue3+vue-router，重构react+react-router前后端分离的商城后台管理系统 williamdsy 前端vue.js重构
    前言：对前端各个技术板块，HTML、CSS、JavaScript、ES6、vue家族，整体上能“摸其大概”。笔者计划重构一个基于react的商城后台管理系统。——2024年2月16日技术选型#语言和框架vue3sassbootstrapES7#架构前后端分离分层架构模块化开发#前端构建工具npmvite#代码管理工具git
  • Bootstrap分割线和普通分割线 sunny-king jsp页面前端显示效果分割线横线
    转载:https://blog.csdn.net/qhwc2009/article/details/45047365align线条位置（可选left、right、center）；width线条长度；color颜色；size厚度
  • milligram css 源码浅析 子洋丶 前端css前端
    一、前言milligram是我在20年接触并使用的一个CSS库，他的出现时间已经无法溯源了，根据npm上的发布时间最早是2015年，而在国内名气起来的时间大概就是2020年了，同时milligram最后的更新也停在了那一年。由于当时只需要做一些简单的页面，只需要一些简单的布局及美观的样式足可以满足我的需求，所以在CSS库的选择上排除了当时Bootstrap、Bulma、Foundation这些相对
  • 聊聊arthas的ArthasBootstrap hello_ejb3 java
    序本文主要研究一下arthas的ArthasBootstrapgetInstancecom/taobao/arthas/core/server/ArthasBootstrap.java/***单例**@paraminstrumentationJVM增强*@returnArthasServer单例*@throwsThrowable*/publicsynchronizedstaticArthasBoo
  • JDK11新特性 星梦客 Javajavajdk
    一、JShell除了表达式之外，还可以创建Java类和方法。jshell也有基本的代码完成功能。二、DynamicClass-FileConstants类文件新添的一种结构Java的类型文件格式将被拓展，支持一种新的常量池格式：CONSTANT_Dynamic，加载CONSTANT_Dynamic会将创建委托给bootstrap方法。其目标是降低开发新形式的可实现类文件约束带来的成本和干扰。三、局
  • 颜色拾取器 jscolor.js插件中工作中遇到的问题 乱来丶Fack
    jscolor.js在动态加载的弹出层上面，点击选择颜色，会有弹不出来的情况的.1.bootstrap中只需要把弹出层的zIndex:层级改高，应该就没问题了。2.还有就是动态加载的弹框的问题，因为jscolor是个方法，他在js加载的时候，就只走一遍，那个时候弹框还没加载进来，所以，他是找不到这个class的，所以就会造成点击input，jscolor弹不出来的情况。解决方案：动态加载jscol
  • java 进销存 销售报表 库存管理 商户管理 springmvc SSM crm 项目 非得起个昵称
    系统介绍：1.系统采用主流的SSM框架jspJSTLbootstraphtml5(PC浏览器使用)2.springmvc+spring4.3.7+mybaits3.3SSM普通javaweb（非maven,附赠pom.xml文件）数据库：mysql3.开发工具：myeclipseeclipseidea均可,没有限制.我这边myeclipse2014导出来的项目源码-----------------
  • LINK : fatal error LNK1104: cannot open file ‘libboost_system-vc90-mt-1_55.lib‘ 老爸我爱你 boost
    事前：编译boost_1_55_0源代码，打开CMD，进入到boost_1_55_0根目录，执行bootstrap.bat后，按提示再执行.\b2完成编译完成。在其他工程序中设置引用这个目录。编译提示cannotopenfile'libboost_system-vc90-mt-1_55.lib'原因：机器上默认使用vs2013编译的，得到的是libboost_system-vc120-mt-1_5
  • 2024年最值得尝试的5个CSS框架 前端达人 cssreact.js前端前端框架javascript
    在2024年选择适合项目的CSS框架至关重要。这将为构建新的用户界面（UI）组件所需的总体努力定下基调。目前，最重要的是更快地发布新功能，以保持客户的满意度。因此，你需要一个易于使用的CSS框架，它能够提供现成的UI元素。下面，我们来看看2024年值得尝试的最佳CSS框架。1、Bootstrap在今天的数字时代，网页设计和开发已经成为创造令人印象深刻在线体验的关键。为了满足这一需求，Bootstr
  • Python+Django+Mysql个性化旅游景区推荐系统 在线旅游景点推荐系统 基于机器学习/深度学习/人工智能 基于标签/协同过滤推荐算法 爬虫 可视化数据分析 linge511873822 python基于项目的协同过滤推荐算法基于用户的协同过滤推荐算法python人工智能django机器学习深度学习推荐算法
    Python+Django+Mysql个性化旅游景区推荐系统在线旅游景点推荐系统基于机器学习/深度学习/人工智能基于标签/协同过滤推荐算法爬虫可视化数据分析WebTravelRecommendSysPy一、项目简介1、开发工具和使用技术Python3及以上版本，Django3.6及以上版本，mysql8，navicat数据库管理工具或者sqlyog数据库管理工具，bootstrap前端框架，htm
  • 聊聊arthas的ArthasBootstrap arthas
    序本文主要研究一下arthas的ArthasBootstrapgetInstancecom/taobao/arthas/core/server/ArthasBootstrap.java/***单例**@paraminstrumentationJVM增强*@returnArthasServer单例*@throwsThrowable*/publicsynchronizedstaticArthasBoo
  • xzxxAdmin後台管理修改思路（吐槽） SA_Arthur
    本後台是公司某個項目的後台，之前已經做好了，又要基於原來的基礎上進行全新改版，我看了一下源碼后感覺腦殼疼。腦殼疼有幾點：1、三套UI框架混合在一起（Bootstrap3、LayUI1.9x、H+）2、插件重複使用，多個版本Jquery混合在一起3、使用JSP，代碼混亂，功能重複，沒有備註光這三點腦殼一直在疼，還有後面發現的一堆問題。解決方案：1、採用Bootstrap框架，其他全部摒棄并刪除。原因
  • 前端开发框架推荐总结二 Devil枫 前端框架前端
    在前端开发领域，框架的选择对于项目的成功至关重要。它们提供了丰富的组件、工具和最佳实践，帮助开发者快速构建出美观、功能强大的用户界面。本文将介绍下面四个前端开发框架：Bootstrap、easyui、jQueryUI和layui。一：Bootstrap特点:1.响应式设计：Bootstrap内置了强大的响应式布局系统，使得网页能够在不同设备和屏幕尺寸上都能良好地显示。2.丰富的组件：提供了大量的U
  • 你知道Web框架有哪些吗? dami_king 前端框架
    BootstrapBootstrap是由Twitter团队推出的开源前端框架，以HTML、CSS和JavaScript为基础，提供了一系列可复用的UI组件和强大的响应式布局系统。它易于上手，有助于开发者快速构建简洁、一致且移动友好的网站。FoundationFoundation同样是一款响应式前端框架，与Bootstrap相似，但它强调模块化和定制性，支持更复杂的布局结构，并且包含一些Bootst
  • 常见的Web前端开发框架推荐 M乔木 日常分享前端框架前端html5javascriptbootstrapvue.js
    常见的Web前端开发框架推荐随着互联网的快速发展，Web前端开发变得越来越重要。一个好的前端框架可以帮助开发者更高效地完成项目，提高代码的可维护性和可扩展性。本文将为大家介绍几个常见的Web前端开发框架，并给出一些示例代码。BootstrapBootstrap是一个流行的前端框架，它提供了一套用于快速开发响应式网站和应用的工具。Bootstrap基于HTML、CSS和JavaScript，可以与任
  • appium实现自动化测试原理 MY测试之路 App自动化测试appiumpython测试工具
    目录1、Appium原理1.1、AndroidAppium原理图文解析1.1.2、原理详解1.1.2.1、脚本端1.1.2.2、appium-server1.1.2.3、中间件bootstrap.jar1.1.2.4、驱动引擎uiautomator1.2、IOSAppium原理1、Appium原理1.1、AndroidAppium原理图文解析执行测试脚本全过程：1、测试脚本通过JsonWirePr
  • 深入浅出Java Annotation(元注解和自定义注解） Josh_Persistence Java Annotation元注解自定义注解
    一、基本概述     　　 Annontation是Java5开始引入的新特征。中文名称一般叫注解。它提供了一种安全的类似注释的机制，用来将任何的信息或元数据（metadata）与程序元素（类、方法、成员变量等）进行关联。   　　更通俗的意思是为程序的元素（类、方法、成员变量）加上更直观更明了的说明，这些说明信息是与程序的业务逻辑无关，并且是供指定的工具或
  • mysql优化特定类型的查询 annan211 java工作mysql
    本节所介绍的查询优化的技巧都是和特定版本相关的，所以对于未来mysql的版本未必适用。 1 优化count查询 对于count这个函数的网上的大部分资料都是错误的或者是理解的都是一知半解的。在做优化之前我们先来看看 真正的count()函数的作用到底是什么。 count()是一个特殊的函数，有两种非常不同的作用，他可以统计某个列值的数量，也可以统计行数。 在统
  • MAC下安装多版本JDK和切换几种方式 棋子chessman jdk
    环境： MAC AIR,OS X 10.10,64位   历史： 过去 Mac 上的 Java 都是由 Apple 自己提供，只支持到 Java 6，并且OS X 10.7 开始系统并不自带（而是可选安装）（原自带的是1.6）。 后来 Apple 加入 OpenJDK 继续支持 Java 6，而 Java 7 将由 Oracle 负责提供。   在终端中输入jav
  • javaScript （1） Array_06 JavaScriptjava浏览器
    JavaScript 1、运算符 　　运算符就是完成操作的一系列符号，它有七类： 　　赋值运算符（=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=）、算术运算符(+,-,*,/,++,--,%)、比较运算符(>,<,<=,>=,==,===,!=,!==)、逻辑运算符(||,&&,!)、条件运算(?:)、位
  • 国内顶级代码分享网站 袁潇含 javajdkoracle.netPHP
           现在国内很多开源网站感觉都是为了利益而做的                  当然利益是肯定的,否则谁也不会免费的去做网站      &
  • Elasticsearch、MongoDB和Hadoop比较 随意而生 mongodbhadoop搜索引擎
      IT界在过去几年中出现了一个有趣的现象。很多新的技术出现并立即拥抱了“大数据”。稍微老一点的技术也会将大数据添进自己的特性，避免落大部队太远，我们看到了不同技术之间的边际的模糊化。假如你有诸如Elasticsearch或者Solr这样的搜索引擎，它们存储着JSON文档，MongoDB存着JSON文档，或者一堆JSON文档存放在一个Hadoop集群的HDFS中。你可以使用这三种配
  • mac os 系统科研软件总结 张亚雄 mac os
    1.1 Microsoft Office for Mac 2011      大客户版，自行搜索。      1.2 Latex （MacTex）:      系统环境：https://tug.org/mactex/     &nb
  • Maven实战（四）生命周期 AdyZhang maven
    1. 三套生命周期     Maven拥有三套相互独立的生命周期，它们分别为clean，default和site。 每个生命周期包含一些阶段，这些阶段是有顺序的，并且后面的阶段依赖于前面的阶段，用户和Maven最直接的交互方式就是调用这些生命周期阶段。 以clean生命周期为例，它包含的阶段有pre-clean, clean 和 post
  • Linux下Jenkins迁移 aijuans Jenkins
    1. 将Jenkins程序目录copy过去      源程序在/export/data/tomcatRoot/ofctest-jenkins.jd.com下面            tar -cvzf jenkins.tar.gz ofctest-jenkins.jd.com &
  • request.getInputStream()只能获取一次的问题 ayaoxinchao requestInputstream
    问题：在使用HTTP协议实现应用间接口通信时，服务端读取客户端请求过来的数据，会用到request.getInputStream()，第一次读取的时候可以读取到数据，但是接下来的读取操作都读取不到数据   原因： 1. 一个InputStream对象在被读取完成后，将无法被再次读取，始终返回-1； 2. InputStream并没有实现reset方法（可以重
  • 数据库SQL优化大总结之 百万级数据库优化方案 BigBird2012 SQL优化
    网上关于SQL优化的教程很多，但是比较杂乱。近日有空整理了一下，写出来跟大家分享一下，其中有错误和不足的地方，还请大家纠正补充。 这篇文章我花费了大量的时间查找资料、修改、排版，希望大家阅读之后，感觉好的话推荐给更多的人，让更多的人看到、纠正以及补充。 1.对查询进行优化，要尽量避免全表扫描，首先应考虑在 where 及 order by 涉及的列上建立索引。 2.应尽量避免在 where
  • jsonObject的使用 bijian1013 javajson
            在项目中难免会用java处理json格式的数据，因此封装了一个JSONUtil工具类。 JSONUtil.java package com.bijian.json.study; import java.util.ArrayList; import java.util.Date; import java.util.HashMap;
  • [Zookeeper学习笔记之六]Zookeeper源代码分析之Zookeeper.WatchRegistration bit1129 zookeeper
    Zookeeper类是Zookeeper提供给用户访问Zookeeper service的主要API，它包含了如下几个内部类     首先分析它的内部类，从WatchRegistration开始，为指定的znode path注册一个Watcher，   /** * Register a watcher for a particular p
  • 【Scala十三】Scala核心七：部分应用函数 bit1129 scala
    何为部分应用函数？ Partially applied function: A function that’s used in an expression and that misses some of its arguments.For instance, if function f has type Int => Int => Int, then f and f(1) are p
  • Tomcat Error listenerStart 终极大法 ronin47 tomcat
    Tomcat报的错太含糊了，什么错都没报出来，只提示了Error listenerStart。为了调试，我们要获得更详细的日志。可以在WEB-INF/classes目录下新建一个文件叫logging.properties，内容如下 Java代码  handlers = org.apache.juli.FileHandler, java.util.logging.ConsoleHa
  • 不用加减符号实现加减法 BrokenDreams 实现
            今天有群友发了一个问题，要求不用加减符号(包括负号)来实现加减法。         分析一下，先看最简单的情况，假设1+1，按二进制算的话结果是10，可以看到从右往左的第一位变为0，第二位由于进位变为1。    
  • 读《研磨设计模式》-代码笔记-状态模式-State bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /* 当一个对象的内在状态改变时允许改变其行为，这个对象看起来像是改变了其类 状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况 把状态的判断逻辑转移到表示不同状态的一系列类中，可以把复杂的判断逻辑简化 如果在
  • CUDA程序block和thread超出硬件允许值时的异常 cherishLC CUDA
    调用CUDA的核函数时指定block 和 thread大小，该大小可以是dim3类型的（三维数组），只用一维时可以是usigned int型的。 以下程序验证了当block或thread大小超出硬件允许值时会产生异常！！！GPU根本不会执行运算！！！ 所以验证结果的正确性很重要！！！ 在VS中创建CUDA项目会有一个模板，里面有更详细的状态验证。 以下程序在K5000GPU上跑的。
  • 诡异的超长时间GC问题定位 chenchao051 jvmcmsGChbaseswap
    HBase的GC策略采用PawNew+CMS, 这是大众化的配置，ParNew经常会出现停顿时间特别长的情况，有时候甚至长到令人发指的地步，例如请看如下日志： 2012-10-17T05:54:54.293+0800: 739594.224: [GC 739606.508: [ParNew: 996800K->110720K(996800K), 178.8826900 secs] 3700
  • maven环境快速搭建 daizj 安装mavne环境配置
    一 下载maven 安装maven之前，要先安装jdk及配置JAVA_HOME环境变量。这个安装和配置java环境不用多说。 maven下载地址：http://maven.apache.org/download.html，目前最新的是这个apache-maven-3.2.5-bin.zip，然后解压在任意位置，最好地址中不要带中文字符，这个做java 的都知道，地址中出现中文会出现很多
  • PHP网站安全，避免PHP网站受到攻击的方法 dcj3sjt126com PHP
    对于PHP网站安全主要存在这样几种攻击方式:1、命令注入(Command Injection)2、eval注入(Eval Injection)3、客户端脚本攻击(Script Insertion)4、跨网站脚本攻击(Cross Site Scripting, XSS)5、SQL注入攻击(SQL injection)6、跨网站请求伪造攻击(Cross Site Request Forgerie
  • yii中给CGridView设置默认的排序根据时间倒序的方法 dcj3sjt126com GridView
    public function searchWithRelated() {         $criteria = new CDbCriteria;         $criteria->together = true; //without th
  • Java集合对象和数组对象的转换 dyy_gusi java集合
        在开发中，我们经常需要将集合对象（List，Set）转换为数组对象，或者将数组对象转换为集合对象。Java提供了相互转换的工具，但是我们使用的时候需要注意，不能乱用滥用。 1、数组对象转换为集合对象     最暴力的方式是new一个集合对象，然后遍历数组，依次将数组中的元素放入到新的集合中，但是这样做显然过
  • nginx同一主机部署多个应用 geeksun nginx
    近日有一需求，需要在一台主机上用nginx部署2个php应用，分别是wordpress和wiki，探索了半天，终于部署好了，下面把过程记录下来。 1.   在nginx下创建vhosts目录，用以放置vhost文件。 mkdir vhosts   2.   修改nginx.conf的配置， 在http节点增加下面内容设置，用来包含vhosts里的配置文件 #
  • ubuntu添加admin权限的用户账号 hongtoushizi ubuntuuseradd
    ubuntu创建账号的方式通常用到两种：useradd 和adduser . 本人尝试了useradd方法，步骤如下： 1:useradd    使用useradd时，如果后面不加任何参数的话，如：sudo useradd sysadm 创建出来的用户将是默认的三无用户：无home directory ,无密码,无系统shell。 顾应该如下操作：  
  • 第五章 常用Lua开发库2-JSON库、编码转换、字符串处理 jinnianshilongnian nginxlua
      JSON库   在进行数据传输时JSON格式目前应用广泛，因此从Lua对象与JSON字符串之间相互转换是一个非常常见的功能；目前Lua也有几个JSON库，本人用过cjson、dkjson。其中cjson的语法严格（比如unicode \u0020\u7eaf），要求符合规范否则会解析失败（如\u002），而dkjson相对宽松，当然也可以通过修改cjson的源码来完成
  • Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解 yaerfeng1989 timerquartz定时器
    原创整理不易，转载请注明出处：Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解 代码下载地址：http://www.zuidaima.com/share/1772648445103104.htm 有两种流行Spring定时器配置：Java的Timer类和OpenSymphony的Quartz。 1.Java Timer定时 首先继承jav
  • Linux下df与du两个命令的差别？ pda158 linux
    　一、df显示文件系统的使用情况，与du比較，就是更全盘化。 　　最经常使用的就是 df -T，显示文件系统的使用情况并显示文件系统的类型。 　　举比例如以下： 　　[root@localhost ~]# df -T 　　Filesystem                   Type &n
  • [转]SQLite的工具类 ---- 通过反射把Cursor封装到VO对象 ctfzh VOandroidsqlite反射Cursor
    在写DAO层时，觉得从Cursor里一个一个的取出字段值再装到VO(值对象)里太麻烦了，就写了一个工具类，用到了反射，可以把查询记录的值装到对应的VO里，也可以生成该VO的List。   使用时需要注意： 考虑到Android的性能问题，VO没有使用Setter和Getter，而是直接用public的属性。 表中的字段名需要和VO的属性名一样，要是不一样就得在查询的SQL中
  • 该学习笔记用到的Employee表 vipbooks oraclesql工作
        这是我在学习Oracle是用到的Employee表，在该笔记中用到的就是这张表，大家可以用它来学习和练习。 drop table Employee; -- 员工信息表 create table Employee( -- 员工编号 EmpNo number(3) primary key, -- 姓
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他