Eric夕颜
Eric夕颜

bootstrap 的 模态框在父iframe中弹出

作为一个后台，公司没前端真的很痛苦，所以就得写页面，用的bootstrap的modal，但是碰到坑了，先上图，期望结果如下

bootstrap 的 模态框在父iframe中弹出_第1张图片

然而呢， 实际情况是下面这样，着实尴尬：

bootstrap 的 模态框在父iframe中弹出_第2张图片

首先，作为一个后台，真的吐槽下网上找到的那些方式，真的是看着都不懂，何况解决问题

废话不多说，现在说解决办法， 其实很简单，没有网上那么多繁琐的步骤，总共改掉的地方也仅仅只有十几行代码

吐槽完了，那么上源码，先来没有解决的，总共是三个html文件，其中modal是直接拷贝bootstrap官网的，没有任何变动的源码

iframe1.html



<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
    head>
    <body>
        <h1>iframe1h1>
    body>
html>

iframe2.html，也就是模态框所在的页面


<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
        <script type="text/javascript" src="../js/jquery-3.3.1.min.js" >script>
        <script type="text/javascript" src="../bootstrap/js/bootstrap.js" >script><br />
        <link rel="stylesheet" href="../bootstrap/css/bootstrap.css" />
    head>
    <body>
        <button id="chooseIndex" type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal" >
          Launch demo modal
        button>

        
        <div id="modal">
            <div class="modal fade " id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" >
              <div class="modal-dialog" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Modal titleh5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">×span>
                    button>
                  div>
                  <div class="modal-body">
                    ...
                  div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Closebutton>
                    <button type="button" class="btn btn-primary">Save changesbutton>
                  div>
                div>
              div>
            div>
        div>
    body>

html>

最后呢，是主页面的代码 index.html


<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
        <script type="text/javascript" src="../js/jquery-3.3.1.min.js" >script>
        <script type="text/javascript" src="../bootstrap/js/bootstrap.js" >script><br />
        <link rel="stylesheet" href="../bootstrap/css/bootstrap.css" />
    head>
    <body>
        <iframe src="iframe1.html" style="width: 40%;height: 1000px;">iframe>

        <iframe src="iframe2.html"  style="width: 50%;height: 1000px;">iframe>

    body>
html>

现在呢， 要做的很简单，index.html 和 iframe.html页面的源码不需要任何改变！只需要动有模态框的页面iframe2.html！

iframe2.html改变之后的代码如下


<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
        <script type="text/javascript" src="../js/jquery-3.3.1.min.js" >script>
        <script type="text/javascript" src="../bootstrap/js/bootstrap.js" >script><br />
        <link rel="stylesheet" href="../bootstrap/css/bootstrap.css" />
    head>

    <body>

        <button onclick="showModal()">展示模态框button>

        
        <div id="modal">
            <div class="modal fade bs-example-modal-sm" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" >
              <div class="modal-dialog" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Modal titleh5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">×span>
                    button>
                  div>
                  <div class="modal-body">
                    ...
                  div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Closebutton>
                    <button type="button" class="btn btn-primary">Save changesbutton>
                  div>
                div>
              div>
            div>
        div>
    body>
    <script>
        function showModal(){
            var topBody = $(top.document.body);
            topBody.append($("#modal").html());

            // 打开父页面的modal框
            window.top.$(".bs-example-modal-sm").modal();

            // 阻止模态框的多次弹出
            window.top.$(".bs-example-modal-sm").on('hidden.bs.modal',function(){
                if($(".bs-example-modal-sm",top.document)!=null){
                    $(".bs-example-modal-sm",top.document).remove();
                }
                return;
            });
        }

    script>

html>

现在说下，都改动的地方，首先，第一步，删掉了，bootstrap提供的那个点击按钮，添加了一个自定义的按钮，并且添加了οnclick=”showModal()”，当然如果想保留样式，也可以，但是需要删掉data-target=”#exampleModal”，这个属性。

<button onclick="showModal()">展示模态框button>

第二步， 给模态框最外层的div加上一个class，


<div class="modal fade " id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" >

<div class="modal fade bs-example-modal-sm" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" >

然后， 第三步，给模态框所有的div外面加了一层div，自定义id=”modal”

"modal">   modal code ...

第四步呢，就是写你的onclick方法了 ，不再详说， 注释很详细

<script>
        function showModal(){
            // 获取最顶层的页面
            var topBody = $(top.document.body);

            // 将模态框的代码添加到顶层页面里面
            topBody.append($("#modal").html());

            // 从顶层页面里面打开模态框
            window.top.$(".bs-example-modal-sm").modal();

            // 阻止模态框的多次弹出，这块不明白的可以，去掉下面的这部分，然后使劲打开，关闭你的modal就明白了
            window.top.$(".bs-example-modal-sm").on('hidden.bs.modal',function(){
                if($(".bs-example-modal-sm",top.document)!=null){
                    $(".bs-example-modal-sm",top.document).remove();
                }
                return;
            });

        }

    script>

到这里就完成了， 希望能给各位像我一样后台的前端小白带来解决办法，有问题可以留言，在线秒回

最后说下， 在这样修改了modal之后，相当于，把modal放在顶层页面了，所以，如果页面里面做了对modal的js或者css样式的修改， 都必须将这些js和css代码放到你顶层的html或者jsp文件中， 否则，模态框上面的那些操作就是无效了。

你可能感兴趣的:(前端)

  • [前端] node版本升级后续 平坑2 -npm版本问题 前端node.jsnpm版本
    最近又遇到了一个前端工程node版本升级的后续问题。一个同事在拉取了最新的master分支，安装依赖后，运行项目时有一个文件缺失，无法编译成功。定位问题：我本地重新拉取了master分支，安装依赖，运行项目可以正常启动，排除项目文件问题。在同事的电脑上重新开了一个文件夹，拉取master分支，执行安装(npminstall)，发现第一行跳了提醒(Thisversionofnpmiscompatib
  • 2024前端面试经验分享 前端面试
    一、简历1、整理步骤把自己过去做过的有亮点的事情整理一遍。项目经历，通过star法则来做，不赘述，网上很多人讲。需要突出的亮点见下面。2、前端开发常见突出亮点：性能优化代码优化组件封装框架原理项目推进、协调能力技术难点的解决能力技术方案设计能力前端工程化的推进3、管理相关亮点如何制定代码规范，以及review如何提升团队人员的水平如何制定流程为团队提效4、注意点遵循star法则；尽量简洁，减少面试
  • Vue3中通过加密串进行后端验证并实现登录跳转教程 ecmascript-6
    在Vue3中进行登录并通过加密串进行后端验证，一般步骤是：用户输入用户名和密码，前端将其加密后发送给后端进行验证，后端验证通过后，返回身份验证信息（如令牌），前端接收验证结果并实现登录跳转。主要步骤：用户输入信息并加密用户输入的密码可以通过加密算法（如SHA256,AES等）进行加密，确保数据的安全性。发送请求到后端前端将加密后的数据发送到后端进行验证，通常使用POST请求。后端验证加密数据后端解
  • mac新手开发基础配置（前端版） macos前端vscode插件
    brewhttps://www.cnblogs.com/hanease/p/15962094.html方法四fnmhttps://www.jianshu.com/p/0843d55e044evscodehttps://blog.csdn.net/weixin_46474921/article/details/132841711有几点需要配置下：1.语言切换成中文2.文件设置自动保存3.取消预览模式
  • 前端-从入门到入土
    前端学习路线基础部分（HTML+CSS+JS入门）快速了解，能够进行简单的页面布局，交互JS部分，可以写一些小demo来熟悉常见的API推荐教程：https://www.bilibili.com/video/BV1BT4y1W7Aw/?spm_id_from=333....框架部分这里推荐Vue框架，相对React会更容易上手，并且中文文档也相对友好推荐教程：https://www.bilibil
  • JavaScript 与 TypeScript 的详细对比
    JavaScript是当前Web开发的主要编程语言，也是现代前端开发的基石。尽管它灵活而强大，但在大型项目中，JavaScript的动态类型系统和无类型检查常常带来代码管理上的问题。为了解决这些问题，微软在2012年推出了TypeScript，这是一种JavaScript的超集，增加了静态类型检查、接口、类和其他现代化的编程特性。本文将深入对比JavaScript和TypeScript，分析两者在
  • 深入 JavaScript：前端开发的核心语言
    JavaScript是一种广泛应用于前端开发的编程语言，最早由Netscape公司在1995年推出。作为一种轻量、解释性和多范式的编程语言，JavaScript支持事件驱动、面向对象和函数式编程。它不仅是网页交互的核心技术之一，还随着Node.js的出现，逐渐渗透到了后端开发。本文将带你了解JavaScript的核心概念、特点及常见应用场景，帮助你掌握这门现代化的编程语言。一、JavaScript
  • Vue.js：轻量高效的前端框架
    Vue.js是一个用于构建用户界面的渐进式JavaScript框架，因其轻量、灵活和易上手的特性备受欢迎。Vue.js不仅适合小型项目的快速开发，也可用于构建复杂的单页面应用（SPA）。本文将介绍Vue.js的核心特性、项目结构、常用功能及其在现代前端开发中的应用场景。一、Vue.js简介Vue.js（简称Vue）由尤雨溪于2014年推出，是一个专注于视图层的JavaScript框架。它采用渐进式
  • Svelte 5震撼发布，前端开发的新变革！ 前端程序员
    title:Svelte5震撼发布，前端开发的新变革！博主小程序体验|博主公众号分享亲爱的前端小伙伴们，大家好！Svelte5正式发布啦！这可是新一代的前端框架哦。就在10月22日，这个备受期待的版本终于和我们见面了。它带来了好多超棒的更新呢。首先，它是完全重写的框架哦。这意味着什么呢？就是它让应用变得更快啦，体积更小了，而且更加可靠。我们写出来的代码也会更加一致，更符合我们的习惯。比如在代码结构
  • unplugin-dist-zip-pack：前端构建产物打包神器，开发者的得力助手
    作为一名前端开发者，在项目开发过程中，我们常常需要对构建产物进行高效的打包管理。最近，我发现了一个超级好用的插件——unplugin-dist-zip-pack，它简直是我们开发者的福音。一、强大的功能特性unplugin-dist-zip-pack能够将构建产物完美打包，并且支持众多主流的构建工具，包括Webpack、Vue-CLI、Vite、Rollup、esbuild、Astro、Nuxt和
  • AJAX是如何凭一己之力提高前端程序员的工资水平的？ 前端程序员ajax
    作者：阿达西链接：juejin.cn/post/7395396352183009290emmm，今天无意间听到一个比较奇怪的信息，就是在很早之前，前端工程师只是一个切图崽，而且工资也不是很高。说白了，就是没含金量的工作。因为那时候的Web应用相对简单，主要关注于页面的静态内容和基本的交互。所以前端开发的工作主要集中在HTML、CSS和基础的JavaScript上。但是自从AJAX出现后，前端程序员
  • 如何启动一个静态的前端工程的服务
    使用场景在前端开发过程中，可能会要对发布到生产的包做验证或者要本地运行一个开源的包的实例，这时候就需要在本地启动一个前端服务，一般有以下两种方式运行方式Live-Server通过VsCode去安装插件LiveServer，然后打开静态工程，点击右下角的LiveServer按钮即可运行工程优点：使用简单，方便快捷缺点：不支持自定义配置，如工程里面需要代理请求，则无法实现express使用expres
  • Javascript(turfjs)等值线图绘制 前端空间计算mapbox
    使用气象、环境类空间数据绘制等值线通常是由NCL、Python来做，在一些场景中：你只是想在WEB端做一些简单的绘制你的后端只有Node.js环境你纯粹是个前端工程师你也许需要使用纯Javascript来做这件事。本文尝试根据空间中的一组散点来绘制等值线图（或色斑图）。1.准备工作turfjs，空间分析（geospatialanalysis）工具包，支持在浏览器和Node.js环境中运行，空间数据
  • 如何用JavaScript判断前端应用运行环境（移动平台还是桌面环境）
    在多模态模型的架构上，ChatGPT的绘图能力主要依赖以下几个核心组件：跨模态编码器（Cross-ModalEncoder）：跨模态编码器的作用是将文本和图像的特征进行对齐。GPT可以将用户输入的文本描述转换为文本特征表示，然后利用跨模态编码器将这些特征映射到图像特征空间。这种方式确保模型能够理解描述性语言中不同细节是如何与图像特征对应的。
  • 腾讯新闻中心首页改版啦 javascripthtml
    本人博客：http://www.xiabingbao.com正式地址：http://www.xiabingbao.com/post/news/2016/05/16/qq-news-revision.html腾讯新闻中心的首页改版啦，欢迎访问【http://news.qq.com】。我是负责这次改版的前端开发工程师，今天也从前端的角度分析一下改版的过程和效果。我们先来看看改版前后的首屏效果：从对比图
  • 后端：撑起互联网世界的基石 后端
    在互联网的广袤世界中，后端如同沉稳的基石，默默支撑着前端的绚烂繁华，是网站、应用和服务的核心，是连接用户与数据的关键桥梁。后端是数据的守护者，负责处理和保护海量的数据，确保数据的安全性、完整性和可靠性，让用户放心使用互联网服务。为提供流畅的用户体验，后端开发者需不断优化系统性能，通过优化数据库查询、缓存技术等手段，提高系统的响应速度和稳定性。随着业务增长，后端系统必须具备良好的可扩展性，开发者要设
  • 后端开发技术 后端
    在当今数字化和互联网化的时代背景下，后端开发技术作为连接前端和用户的重要桥梁，正以前所未有的速度发展和演进。后端开发的核心技术通常包括主流服务器端语言如Java、Python、Node.js等；关系型或非关系型数据库如MySQL、MongoDB等；容器编排工具如Docker、Kubernetes等。以Python为例，其简洁明了的语法受众多开发者青睐，适合快速原型开发和敏捷项目交付。随着云计算的普
  • 探索后端的无尽魅力：构建强大而高效的服务器世界 后端
    在当今数字化的时代，后端技术犹如一座坚实的桥梁，连接着用户和丰富多彩的互联网世界。后端是默默耕耘的力量，在互联网舞台上，前端吸引眼球，而后端是支撑舞台的坚实支柱。它负责处理数据、管理服务器、确保系统的稳定性和安全性，没有后端，前端的华丽展示将无从谈起。随着技术发展，后端领域迎来诸多热点，如人工智能、大数据、云计算等新兴技术崛起，为后端开发带来无限可能，但也带来新挑战，如在海量数据中实现高效处理和存
  • Svelte 最新中文文档（4）—— 符文（Runes）下
    前言Svelte，一个非常“有趣”、用起来“很爽”的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目，也是我做个人项目的首选技术栈。目前Svelte基于Svelte5发布了最新的官方文档，但却缺少对应的中文
  • Long类型前后端数据不一致 igotyback 前端
    响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 【加密社】Solidity 中的事件机制及其应用 加密社 闲侃区块链智能合约区块链
    加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • springboot+vue项目实战一-创建SpringBoot简单项目 苹果酱0567 面试题汇总与解析springboot后端java中间件开发语言
    这段时间抽空给女朋友搭建一个个人博客，想着记录一下建站的过程，就当做笔记吧。虽然复制zjblog只要一个小时就可以搞定一个网站，或者用cms系统，三四个小时就可以做出一个前后台都有的网站，而且想做成啥样也都行。但是就是要从新做，自己做的意义不一样，更何况，俺就是专门干这个的，嘿嘿嘿要做一个网站，而且从零开始，首先呢就是技术选型了，经过一番思量决定选择-SpringBoot做后端，前端使用Vue做一
  • 博客网站制作教程 2401_85194651 javamaven
    首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
  • 最简单将静态网页挂载到服务器上(不用nginx) 全能全知者 服务器nginx运维前端html笔记
    最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl
  • 补充元象二面 Redstone Monstrosity 前端面试
    1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重
  • 微信小程序开发注意事项 jun778895 微信小程序小程序
    微信小程序开发是一个融合了前端开发、用户体验设计、后端服务（可选）以及微信小程序平台特性的综合性项目。这里，我将详细介绍一个典型的小程序开发项目的全过程，包括项目规划、设计、开发、测试及部署上线等各个环节，并尽量使内容达到或超过2000字的要求。一、项目规划1.1项目背景与目标假设我们要开发一个名为“智慧校园助手”的微信小程序，旨在为学生提供一站式校园生活服务，包括课程表查询、图书馆座位预约、食堂
  • 字节二面 Redstone Monstrosity 前端面试
    1.假设你是正在面试前端开发工程师的候选人，面试官让你详细说出你上一段实习过程的收获和感悟。在上一段实习过程中，我获得了宝贵的实践经验和深刻的行业洞察，以下是我的主要收获和感悟：一、专业技能提升框架应用熟练度：通过实际项目，我深入掌握了React、Vue等前端框架的使用，不仅提升了编码效率，还学会了如何根据项目需求选择合适的框架。问题解决能力：在实习期间，我遇到了许多预料之外的技术难题。通过查阅文
  • eclipse maven IXHONG eclipse
    eclipse中使用maven插件的时候，运行run as maven build的时候报错 -Dmaven.multiModuleProjectDirectory system propery is not set. Check $M2_HOME environment variable and mvn script match.   可以设一个环境变量M2_HOME指
  • timer cancel方法的一个小实例 alleni123 多线程timer
    package com.lj.timer; import java.util.Date; import java.util.Timer; import java.util.TimerTask; public class MyTimer extends TimerTask { private int a; private Timer timer; pub
  • MySQL数据库在Linux下的安装 ducklsl mysql
    1.建好一个专门放置MySQL的目录 /mysql/db数据库目录 /mysql/data数据库数据文件目录 2.配置用户，添加专门的MySQL管理用户 >groupadd mysql ----添加用户组 >useradd -g mysql mysql ----在mysql用户组中添加一个mysql用户 3.配置，生成并安装MySQL >cmake -D
  • spring------>>cvc-elt.1: Cannot find the declaration of element Array_06 springbean
    将-------- <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans"     xmlns:xsi="http://www.w3
  • maven发布第三方jar的一些问题 cugfy maven
    maven中发布 第三方jar到nexus仓库使用的是 deploy:deploy-file命令 有许多参数，具体可查看 http://maven.apache.org/plugins/maven-deploy-plugin/deploy-file-mojo.html 以下是一个例子： mvn  deploy:deploy-file -DgroupId=xpp3
  • MYSQL下载及安装 357029540 mysql
        好久没有去安装过MYSQL，今天自己在安装完MYSQL过后用navicat for mysql去厕测试链接的时候出现了10061的问题，因为的的MYSQL是最新版本为5.6.24，所以下载的文件夹里没有my.ini文件，所以在网上找了很多方法还是没有找到怎么解决问题，最后看到了一篇百度经验里有这个的介绍，按照其步骤也完成了安装，在这里给大家分享下这个链接的地址
  • ios TableView cell的布局 张亚雄 tableview
      cell.imageView.image = [UIImage imageNamed:[imageArray objectAtIndex:[indexPath row]]];           CGSize itemSize = CGSizeMake(60, 50);   &nbs
  • Java编码转义 adminjun java编码转义
    import java.io.UnsupportedEncodingException; /** * 转换字符串的编码 */ public class ChangeCharset { /** 7位ASCII字符，也叫作ISO646-US、Unicode字符集的基本拉丁块 */ public static final Strin
  • Tomcat 配置和spring aijuans spring
    简介 Tomcat启动时，先找系统变量CATALINA_BASE，如果没有，则找CATALINA_HOME。然后找这个变量所指的目录下的conf文件夹，从中读取配置文件。最重要的配置文件：server.xml 。要配置tomcat，基本上了解server.xml，context.xml和web.xml。 Server.xml --  tomcat主
  • Java打印当前目录下的所有子目录和文件 ayaoxinchao 递归File
    其实这个没啥技术含量，大湿们不要操笑哦，只是做一个简单的记录，简单用了一下递归算法。   import java.io.File; /** * @author Perlin * @date 2014-6-30 */ public class PrintDirectory { public static void printDirectory(File f
  • linux安装mysql出现libs报冲突解决 BigBird2012 linux
    linux安装mysql出现libs报冲突解决 安装mysql出现 file /usr/share/mysql/ukrainian/errmsg.sys from install of MySQL-server-5.5.33-1.linux2.6.i386 conflicts with file from package mysql-libs-5.1.61-4.el6.i686  
  • jedis连接池使用实例 bijian1013 redisjedis连接池jedis
    实例代码： package com.bijian.study; import java.util.ArrayList; import java.util.List; import redis.clients.jedis.Jedis; import redis.clients.jedis.JedisPool; import redis.clients.jedis.JedisPoo
  • 关于朋友 bingyingao 朋友兴趣爱好维持
      成为朋友的必要条件：    志相同，道不合，可以成为朋友。譬如马云、周星驰一个是商人，一个是影星，可谓道不同，但都很有梦想，都要在各自领域里做到最好，当他们遇到一起，互相欣赏，可以畅谈两个小时。     志不同，道相合，也可以成为朋友。譬如有时候看到两个一个成绩很好每次考试争做第一，一个成绩很差的同学是好朋友。他们志向不相同，但他
  • 【Spark七十九】Spark RDD API一 bit1129 spark
    aggregate package spark.examples.rddapi import org.apache.spark.{SparkConf, SparkContext} //测试RDD的aggregate方法 object AggregateTest { def main(args: Array[String]) { val conf = new Spar
  • ktap 0.1 released bookjovi kerneltracing
    Dear, I'm pleased to announce that ktap release v0.1, this is the first official release of ktap project, it is expected that this release is not fully functional or very stable and we welcome bu
  • 能保存Properties文件注释的Properties工具类 BrokenDreams properties
            今天遇到一个小需求：由于java.util.Properties读取属性文件时会忽略注释，当写回去的时候，注释都没了。恰好一个项目中的配置文件会在部署后被某个Java程序修改一下，但修改了之后注释全没了，可能会给以后的参数调整带来困难。所以要解决这个问题。     &nb
  • 读《研磨设计模式》-代码笔记-外观模式-Facade bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /* * 百度百科的定义： * Facade（外观）模式为子系统中的各类（或结构与方法）提供一个简明一致的界面， * 隐藏子系统的复杂性，使子系统更加容易使用。他是为子系统中的一组接口所提供的一个一致的界面 * * 可简单地
  • After Effects教程收集 cherishLC After Effects
    1、中文入门 http://study.163.com/course/courseMain.htm?courseId=730009 2、videocopilot英文入门教程（中文字幕） http://www.youku.com/playlist_show/id_17893193.html 英文原址： http://www.videocopilot.net/basic/ 素
  • Linux Apache 安装过程 crabdave apache
    Linux Apache 安装过程   下载新版本： apr-1.4.2.tar.gz（下载网站：http://apr.apache.org/download.cgi） apr-util-1.3.9.tar.gz（下载网站：http://apr.apache.org/download.cgi） httpd-2.2.15.tar.gz（下载网站：http://httpd.apac
  • Shell学习 之 变量赋值和引用 daizj shell变量引用赋值
    本文转自：http://www.cnblogs.com/papam/articles/1548679.html Shell编程中，使用变量无需事先声明，同时变量名的命名须遵循如下规则： 首个字符必须为字母（a-z，A-Z） 中间不能有空格，可以使用下划线（_） 不能使用标点符号 不能使用bash里的关键字（可用help命令查看保留关键字） 需要给变量赋值时，可以这么写：
  • Java SE 第一讲（Java SE入门、JDK的下载与安装、第一个Java程序、Java程序的编译与执行） dcj3sjt126com javajdk
    Java SE 第一讲： Java SE：Java Standard Edition Java ME: Java Mobile Edition Java EE：Java Enterprise Edition Java是由Sun公司推出的（今年初被Oracle公司收购）。 收购价格：74亿美金 J2SE、J2ME、J2EE JDK：Java Development
  • YII给用户登录加上验证码 dcj3sjt126com yii
    1、在SiteController中添加如下代码： /** * Declares class-based actions. */ public function actions() { return array( // captcha action renders the CAPTCHA image displ
  • Lucene使用说明 dyy_gusi Lucenesearch分词器
    Lucene使用说明 1、lucene简介 1.1、什么是lucene     Lucene是一个全文搜索框架，而不是应用产品。因此它并不像baidu或者googleDesktop那种拿来就能用，它只是提供了一种工具让你能实现这些产品和功能。 1.2、lucene能做什么     要回答这个问题，先要了解lucene的本质。实际
  • 学习编程并不难,做到以下几点即可! gcq511120594 数据结构编程算法
    不论你是想自己设计游戏，还是开发iPhone或安卓手机上的应用，还是仅仅为了娱乐，学习编程语言都是一条必经之路。编程语言种类繁多，用途各 异，然而一旦掌握其中之一，其他的也就迎刃而解。作为初学者，你可能要先从Java或HTML开始学，一旦掌握了一门编程语言，你就发挥无穷的想象，开发 各种神奇的软件啦。 1、确定目标 学习编程语言既充满乐趣，又充满挑战。有些花费多年时间学习一门编程语言的大学生到
  • Java面试十问之三：Java与C++内存回收机制的差别 HNUlanwei javaC++finalize()堆栈内存回收
    大家知道， Java 除了那 8 种基本类型以外，其他都是对象类型（又称为引用类型）的数据。 JVM 会把程序创建的对象存放在堆空间中，那什么又是堆空间呢？其实，堆（ Heap）是一个运行时的数据存储区，从它可以分配大小各异的空间。一般，运行时的数据存储区有堆（ Heap）和堆栈（ Stack），所以要先看它们里面可以分配哪些类型的对象实体，然后才知道如何均衡使用这两种存储区。一般来说，栈中存放的
  • 第二章 Nginx+Lua开发入门 jinnianshilongnian nginxlua
    Nginx入门 本文目的是学习Nginx+Lua开发，对于Nginx基本知识可以参考如下文章： nginx启动、关闭、重启 http://www.cnblogs.com/derekchen/archive/2011/02/17/1957209.html agentzh 的 Nginx 教程 http://openresty.org/download/agentzh-nginx-tutor
  • MongoDB windows安装 基本命令 liyonghui160com
      windows安装    安装目录：   D:\MongoDB\   新建目录   D:\MongoDB\data\db   4.启动进城：   cd D:\MongoDB\bin   mongod -dbpath D:\MongoDB\data\db   &n
  • Linux下通过源码编译安装程序 pda158 linux
    一、程序的组成部分 　　Linux下程序大都是由以下几部分组成： 　　二进制文件：也就是可以运行的程序文件 　　库文件：就是通常我们见到的lib目录下的文件 　　配置文件：这个不必多说，都知道 　　帮助文档：通常是我们在linux下用man命令查看的命令的文档 　　 二、linux下程序的存放目录 　　linux程序的存放目录大致有三个地方： 　　/etc, /b
  • WEB开发编程的职业生涯４个阶段 shw3588 编程Web工作生活
    觉得自己什么都会 2007年从学校毕业，凭借自己原创的ASP毕业设计，以为自己很厉害似的，信心满满去东莞找工作，找面试成功率确实很高，只是工资不高，但依旧无法磨灭那过分的自信，那时候什么考勤系统、什么OA系统、什么ERP，什么都觉得有信心，这样的生涯大概持续了约一年。 根本不是自己想的那样 2008年开始接触很多工作相关的东西，发现太多东西自己根本不会，都需要去学，不管是asp还是js，
  • 遭遇jsonp同域下变作post请求的坑 vb2005xu jsonp同域post
    今天迁移一个站点时遇到一个坑爹问题,同一个jsonp接口在跨域时都能调用成功,但是在同域下调用虽然成功,但是数据却有问题. 此处贴出我的后端代码片段 $mi_id = htmlspecialchars(trim($_GET['mi_id '])); $mi_cv = htmlspecialchars(trim($_GET['mi_cv ']));  贴出我前端代码片段: $.aj
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他