Rails 101(Rails 5版) bootstrap/dropdown

让这个网站有实际“登入”、“登出”的功能

练习到这个章节时出现下接菜单没有反应

这里是使用bootstrap的dropdown功能,到官方查了一下安装方法,发现缺少了一个 jQuery,我们要把他安装好,方法如下:

1、在Gemfile增加  gem ‘jquery-rails‘ ,然后 bundle

2、app/assets/javascripts/application.js里增加

//= require jquery
//= require bootstrap-sprockets

然后把教程里的删除掉

//= require bootstrap/alert
//= require bootstrap/dropdown

因为bootstrap-sprockets里有上面2个功能,如果3个放在一起会出现冲突。

然后重启服务器rails s,刷新浏览器就正常显示下拉菜单了。

这里有另一个我之前学习过的一个处理方法,其实中同一个道理。

https://www.cnblogs.com/roy0524/p/7769212.html

原文地址:https://www.cnblogs.com/roy0524/p/9138381.html

时间: 2024-07-31 18:41:16

Rails 101(Rails 5版) bootstrap/dropdown的相关文章

Rails Bootstrap dropdown下拉菜单没反应解决方法

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #ffffff } span.s1 { } Mac环境 Rails 5.1.4 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #ffffff } span.s1 { }

Bootstrap dropdown require Popper.js

<script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>放在引用Bootstrap.js之前解决 网页有 dropdown 样式的 出脚本错误问题Bootstrap dropdown require Popper.js 原文地址:https://blog.51cto.com/zhaoyingyatou/2365456

Bootstrap dropdown menu within a responsive table

Bootstrap 的 dropdown menu 在 responsive table内 会被外层遮挡住 解决办法: $('.table-responsive').on('show.bs.dropdown', function () { $('.table-responsive').css( "overflow", "inherit" ); }); $('.table-responsive').on('hide.bs.dropdown', function ()

bootstrap dropdown的点击变为:hover 后自动下拉

翻了不少地方.找到这段代码. 先把这个复制到bootstrap.min.js下面增加 1 /* 2 3 * Project: Twitter Bootstrap Hover Dropdown 4 * Author: Cameron Spear 5 * Contributors: Mattia Larentis 6 * 7 * Dependencies?: Twitter Bootstrap's Dropdown plugin 8 * 9 * A simple plugin to enable t

用Bootstrap知识写简易版Bootstrap官方网站首页

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>BootStrap网站首页</title> <link rel="stylesheet" type="text/css" href="js/bootstrap.css"/> <script type="text

ABBYY FineReader 14下载 v14.0.101中文破解版

ABBYY FineReader 14是由abbyy推出的一款专业ocr识别软件,也被称为泰比OCR识别软件,软件的主要作用就是可以将PDF.图片中的文档转换为可编辑的格式,拥有操作简单.识别率高的特点,ABBYY FineReader 14可以转换几乎所有打印的文档类型,安装激活后就可以正常使用了,新版本还来了全新的功能,比如标记和标注PDF,对比文档等,有需要的快快下载吧.ABBYY FineReader 14功能一.多个PDF编辑工具:从添加新页面到内容编辑,可以将你的PDF工作上升到全新

如何从 0 开始学 ruby on rails (漫步版)

如何从 0 开始学 ruby on rails (漫步版) ruby 是一门编程语言,ruby on rails 是 ruby 的一个 web 框架,简称 rails. 有很多人对  rails 感兴趣,但又不知道从何下手.学习路线是什么,因为在多个场合下回答过类似问题,所以决定整理成文章供大家参观. 有很多人选择直接学习 rails,在学习使用 rails 的过程中学习 ruby.但我觉得这有些本末倒置,我更推崇先学 ruby 再学 rails,在对 ruby 有了一定的了解后再学 rails

【转】Rails中Bootstrap的安装和使用

转自:http://blog.csdn.net/lissdy/article/details/9195651 眼看着前端攻城师们都开始使用Bootstrap创作网页,于是也想学着在最近正在学习的Rails中使用Bootstrap. 具体安装使用过程如下: 1.创建Rails工程 rails new usedschool   2.生成脚手架 rails g scaffold Item title:string description:text --skip-stylesheets 3.应用迁移 r

ubuntu 14.04中安装 ruby on rails 环境(填坑版) 呕血推荐

环境:在win7 上Vmware虚拟机环境中安装的ubuntu 14.04 开发相关: ruby 2.2.0 rails 4.2.0 sublime text 3 本文说明:所有的命令均在$ 之后,若$前边带有信息,只是为了方便你理解和与自己对照. 安装过程中由于这样那样的原因,产生许多坑,所谓坑是对初学者来说,大牛们飘过吧. 步骤1.从官网下载ubuntu 14.04 X64 http://124.205.69.136/files/2013000000502943/202.141.176.11