标签:lin img for 依赖 file类 javascrip ext 表单 net
<!--1、bootstrap.min.css 2、fileinput.min.css 3、jquery-3.2.1.min.js 4、bootstrap.min.js 5、fileinput.min.js 6、fileinput_locale_zh.js(可选择)--> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css"> <link rel="stylesheet" type="text/css" href="css/fileinput.css"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="bootstrap/js/bootstrap.js"></script> <script type="text/javascript" src="js/fileinput.js"></script> <!-- 中文化,注意locale语言文件在fileinput.min.js文件之后引入 --> <script type="text/javascript" src="js/fileinput_locale_zh.js"></script>
<form method="POST" action="#">
<div class="form-group">
<label for="file">文件输入</label>
<input type="file" name="file" id=‘myfile‘>
</div>
<input type="submit" name="submit" value=‘提交‘ class="btn btn-primary">
</form>
初始化fileinput插件
<script type="text/javascript">
$(‘#myfile‘).fileinput();
</script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>file-input demo</title> <!-- 导入核心CSS及JS文件 --> <!--1、bootstrap.min.css 2、fileinput.min.css 3、jquery-3.2.1.min.js 4、bootstrap.min.js 5、fileinput.min.js 6、fileinput_locale_zh.js(可选择)--> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css"> <link rel="stylesheet" type="text/css" href="css/fileinput.css"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="bootstrap/js/bootstrap.js"></script> <script type="text/javascript" src="js/fileinput.js"></script> <!-- 中文化,注意locale语言文件在fileinput.min.js文件之后引入 --> <script type="text/javascript" src="js/fileinput_locale_zh.js"></script> <!-- /导入导入核心CSS及JS文件 --> </head> <body> <div class="container"> <div class="row"> <div class="col-lg-6"> <h1>fileinput插件基础样例</h1> <!-- 基本file类型的表单的样式 --> <form method="POST" action="#"> <div class="form-group"> <label for="file">文件输入</label> <input type="file" name="file" id=‘myfile‘> </div> <input type="submit" name="submit" value=‘提交‘ class="btn btn-primary"> </form> <!-- /基本file类型的表单的样式 --> </div> </div> </div> <!-- 初始化fileinput插件 --> <script type="text/javascript"> $(‘#myfile‘).fileinput(); </script> </body> </html>
本地Bootstrap文件字体图标无法显示:http://blog.csdn.net/nongweiyilady/article/details/53611094
简而言之,是因为我只引入了bootstrap.css文件,而这个css文件的字体图标是依赖于外部文件的,解决方法就是导入整个bootstrap文件夹,保证万无一失嘛
Bootstrap fileinput:文件上传插件的基础用法
标签:lin img for 依赖 file类 javascrip ext 表单 net
原文地址:http://www.cnblogs.com/yolo-bean/p/7678486.html