牛骨文教育服务平台(让学习变的简单)
博文笔记

第一次想使用插件,就看看啦!jquery-confirm

创建时间:2016-06-30 投稿人: 浏览次数:6973

首先来说这个插件我刚刚开始使用,使用并不是那么6666

  1. 使用初体验
    我没有使用sea.js进行管理,就使用一般的操作手段进行使用,简单的看看这个例子
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="./../../js/jquery-confirm/css/jquery-confirm.css">
    <link rel="stylesheet" type="text/css" href="./../../js/bootstrap/css/bootstrap.css">
    <script type="text/javascript" src="./../../js/jquery.min.js"></script>
    <script type="text/javascript" src="./../../js/bootstrap/jsootstrap.js"></script>
    <script type="text/javascript" src="./../../js/jquery-confirm/js/jquery-confirm.js"></script>
    <script type="text/javascript" src="./confirm-function.js"></script>

</head>
<body>
<div class="col-md-3">
    <button class="btn btn-primary btn-block example-pc-3">Animations</button>
    <p class="text-success">Clean animations</p>

</div>

</body>
</html>
/**
 * Created by JetWang on 2016/6/25.
 */


$(function(){
    $(".example-pc-3").bind("click",function(){
        $.alert(
            {
                title : "你好啊",
                content: "这样真的好?"
            }


        );
    })
});

然后就是我们的效果图啦
这里写图片描述

是不是看上去非常的简单,这种控件怎么说呢,我们的使用的频率还是挺高的

  1. 确认信息对错
   $.confirm({
        title: "Confirm!",
        content: "Simple confirm!",
        confirm: function(){

        },
        cancel: function(){

        }
    });
  1. 简单的模态对话框
    $.dialog({
        title: "Text content!",
        content: "Simple modal!",
    });
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。