zoukankan      html  css  js  c++  java
  • bootstrap jq

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Document</title>
    </head>
    <link type="text/css" rel="stylesheet" href="bootstrap/css/bootstrap.css">
    <script type="text/javascript" src="jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript">
    $(function(){
    $('#add').on('click',function(){
    $(".one a").append('<span>点数</span>');
    console.log('sssss');
    })
    $('[data-toggle="tooltip"]').tooltip();

    $('[data-toggle="popover"]').popover();

    $('.bbb').on('click',function(){
    console.log('saaaa');
    var $btn = $(this).button('loading');
    $btn.button('reset');
    })

    $('#close').on('closed.bs.alert', function () {
    // do something…
    console.log('cloase btn');
    })
    })
    </script>
    <body>
    <div class="one container">
    <a href="#" class="">dsds</a>
    <button id="add" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="向下提示">添加</button>
    <br><br><br><br><br><br><br><br><br>
    <a href="#" data-toggle="tooltip" title="Some tooltip text!">Hover over me</a>
    <div class="tooltip top" role="tooltip">
    <div class="tooltip-arrow"></div>
    <div class="tooltip-inner">
    Some tooltip text!
    </div>
    </div>

    <div class="row">
    <button type="button" class="btn btn-lg btn-danger" data-toggle="popover" data-trigger="focus" data-placement="top" title="Popover title" data-content="And here's some<br> d amazing content.<br> It's very engaging. Right?">点我弹出/隐藏弹出框</button>
    </div>

    <div class="row">
    <div class="alert alert-success">
    <button type="button" id="close" class="close" data-dismiss="alert" aria-hidden="true">
    &times;
    </button>
    <strong>提示成功</strong>
    </div>

    </div>
    <div class="row">
    <button type="button" id="submit" class="btn btn-default bbb" data-loading-text="Loading..." >提交</button>

    <button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">
    Loading state
    </button>

    <script>
    $('#myButton').on('click', function () {
    var $btn = $(this).button('loading')
    // business logic...
    // $btn.button('reset')
    setTimeout(function(){ $btn.button('reset') },2000);
    })
    </script>
    </div>


    <div class="row">
    <a class="btn btn-default" data-toggle="collapse" expanded="false" href="#collEx">
    打开
    </a>
    <div class="collapse" id="collEx">
    <div class="well">
    dsdsdsdsd
    </div>
    </div>
    </div>


    </div>
    </body>
    </html>

  • 相关阅读:
    ExtJS 使用点滴 四 XTemplate使用方法
    ExtJS 使用点滴 三 TreeGrid 单击事件侦听例子
    VS2008 引用App_Code下的类文件问题解决方法
    C# 文件操作类大全(转摘)
    SqlParameter数组
    ExtJS 使用点滴 二 如何使用XTemplate基于同行的其他列的值,改变当前列的显示样式
    ScriptManager.RegisterStartupScript方法
    ExtJS 使用点滴 一(XTemlpate)
    Jquery 远程调用 webService报错,500错误
    C# 调用数据库函数 转摘
  • 原文地址:https://www.cnblogs.com/suxiaolong/p/6654192.html
Copyright © 2011-2022 走看看