微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery UI Bootstrap是什么?

jQuery UI Bootstrap是一个将jQuery UI集成到Bootstrap上的CSS框架,jQuery UI Bootstrap不仅可以利用jQuery UI强大的控件库,同时还可以享受Bootstrap那种清新自然的主题风格,所以越来越多的前端开发者都在使用jQuery UI Bootstrap。

jQuery UI Bootstrap的特点

-----基于jQuery UI,因此控件功能非常强大,可以使用全部的jQuery UI控件。 ----- 基于Bootstrap,不同控件有了统一的外观。 -----免费开源,你可以很方便地下载和使用。

jQuery UI Bootstrap常用控件的使用

下面我们来介绍几个最常用的jQuery UI Bootstrap控件,使用方法都非常简单。

jQuery UI Bootstrap 按钮

rush:js;"> // Button $('button').button(); // Anchors,Submit $('.button').button();

jQuery UI Bootstrap 对话框

rush:js;"> // Dialog Link $('#dialog_link').click(function () { $('#dialog_simple').dialog('open'); return false; });

// Modal Link
$('#modal_link').click(function () {
$('#dialog-message').dialog('open');
return false;
});

// Dialog Simple
$('#dialog_simple').dialog({
autoOpen: false,width: 600,buttons: {
"Ok": function () {
$(this).dialog("close");
},"Cancel": function () {
$(this).dialog("close");
}
}
});

// Dialog message
$("#dialog-message").dialog({
autoOpen: false,modal: true,buttons: {
Ok: function () {
$(this).dialog("close");
}
}
});

jQuery UI Bootstrap 日期选择器

rush:js;"> // Datepicker $('#datepicker').datepicker({ inline: true });

jQuery UI Bootstrap 菜单

rush:js;"> //####### Menu $("#menu").menu();

jQuery UI Bootstrap还有很多控件,这里就不一一列举了,大家可以前往其官方网站下载使用。

本文链接

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

如果大家还想深入学习,可以点击进行学习,再为大家附一个精彩的专题:

原文地址:https://www.jb51.cc/jquery/47777.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐