master

分支 (1)

管理

管理

master

MyBootstrapEx
/
homepage.html

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

<head>
    <meta charset="UTF-8"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"></meta>
    <title>Document</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"></meta>

    <meta name="author" content="http://www.huayingsoft.com/"></meta>
    <meta name="renderer" content="webkit"></meta>
    <meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10" />
    <meta http-equiv="Expires" content="0" />
    <meta http-equiv="Cache-Control" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-store" />

    <link rel="stylesheet" href="css/bootstrap.min.css"></link>
    <link rel="stylesheet" href="css/from/bootstrap-datetimepicker.min.css"></link>
    <link rel="stylesheet" href="css/from/bootstrap-select.css"></link>
    <link rel="stylesheet" href="css/bootstrapEx.css"></link>

    <script src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="js/from/global.js"></script>
    <script type="text/javascript" src="js/from/jquery.smart-form.js"></script>
    <script type="text/javascript" src="js/from/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="js/from/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
    <script type="text/javascript" src="js/from/bootstrap-select.js" charset="UTF-8"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/bootstrapEx2.0.js"></script>
    <style>
        .myR-bot{
            display: none;
            height: 0px;
        }
    </style>
</head>

<body>
    <div class="">
        <h1>
            <a class="anchor" href="#mybootstrapex"></a>JQ-Bootstrap</h1>
        <h4>
            <a id="项目介绍" class="anchor" href="#"></a>项目介绍</h4>
        <p>Bootstrap扩展，与JQ结合使用</p>
        开发背景
        <p>
            我是做.net出身，公司在开始使用原生Bootstrap做为前端时，遇到了许多问题：<p/>
            1.由于后台管理程序界面大同小异，页面的大多数功能就是对数据的增删改查，<br/>
            复杂的逻辑由后台程序执行；所以当使用Bootstrap时有很多HTML是需要反复重复的粘贴复制，使用模板页又不能保证灵活性<br/>
            如果做了很多页面后需要统一修改，就会相当麻烦，对于专注后台代码人员是一个很大的工作量；<p/>
            2.后台代码人员对前端不是很熟悉，而且不会花大量时间优化前端代码，导致不同程序员开发的页面样式不统一，整个软件看着就不是一个风格；<p/>
            3.原生Bootstrap部分控件并不能满足客户需求，需要引用其他第三方插件，当多个第三方插件组合在一起的时候程序员的噩梦又开始了；<p/>
            所以如果公司没有专门的前端人员，也没有成熟的Bootstrap模板框架，将会遇到三个问题：重复的工作量，影响开发周期；页面风格不统一；前台代码逻辑复杂很难维护；<p/>
            当我发现这三个问题后着手用jquery封装原生Bootstrap和第三方插件，使页面引用统一的js和css，在尽量保证开发灵活的同时统一页面布局和样式，<br/>
            现在整理出来作为开源项目，如果该插件能为后台程序员解决前端问题我会很欣慰；<p/>
            </p>
        <p><h4>项目源码</h4><a href="https://gitee.com/shixixiyue/MyBootstrapEx" target="_blank">https://gitee.com/shixixiyue/MyBootstrapEx</a> </p>
        <p>可以通过右上角 [查看本页面源码] 进行在线查看，方便学习</p>
        <p>
            v2.0版本  <a href="https://shixixiyue.gitee.io/mybootstrapex/" target="_blank">https://shixixiyue.gitee.io/mybootstrapex/</a>  </p>
        <p>
            版本1.0地址 <a href="http://www.jq22.com/jquery-info14436" target="_blank">http://www.jq22.com/jquery-info14436</a> </p>
        <p></p>
        <h4>
            <a id="软件架构" class="anchor" href="#"></a>软件架构</h4>
        <p>基于Bootstrap，第三方Bootstrap插件，JQuery</p>
        <h4>
            <a id="联系我" class="anchor" href="#"></a>联系我</h4>
        <p>@北京-没想好</p>
        <p>
            QQ<br/>
            <a href="tencent://message/?uin=935732994&amp;Site=''&amp;Menu=yes">935732994</a></p>
        <p>
            我的博客地址<br/> <a href="http://www.cnblogs.com/shiworkyue/" target="_blank">http://www.cnblogs.com/shiworkyue/</a> </p>
        <p/>

    </div>
</body>
<script>
    $(document).ready(function() {});
</script>
<script type="text/javascript">// <![CDATA[
window.tctipConfig = {
    staticPrefix: "http://static.tctip.com",
    buttonImageId: 3,
    buttonTip: "zanzhu",
    list:{
      alipay: {qrimg: "http://140.143.155.224:8083/zfb20.png"},
      weixin:{qrimg: "http://140.143.155.224:8083/winxin20.png"},
    }
};
// ]]></script>
<script type="text/javascript" src="http://static.tctip.com/js/tctip.min.js"></script>

</html>