我是jQuery和Bootstrap的新手。一切都很顺利,直到我决定使用Bootstrap Tokenfield添加基于搜索系统。
现在,当我尝试执行my,jsp页面时,我得到:Uncaught TypeError:$(...)。tokenfield不是函数
这是我的.jsp页面
JQuery导入
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<link rel="stylesheet" href="/webjars/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="/webjars/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<title></title>
</head>
组件声明
<input type="text" class="form-control" id="tokenfield" value="red,green,blue" />
$('#tokenfield').tokenfield({
autocomplete: {
source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
delay: 100
},
showAutocompleteOnFocus: true
})
我在做什么?我忘记带点什么了?
答案 0 :(得分:2)
DOM告诉你它不知道tokenfield函数,因为它没有在你的标题中声明,所以你必须先加载这两个文件才能使用它:
1 - 加载dist/bootstrap-tokenfield.min.js
2 - 在HTML
中加载dist/css/bootstrap-tokenfield.css
让你的代码原样
注意:那2个图书馆需要作为要求:jQuery 1.9 +,Bootstrap 3+(仅限CSS)
图书馆链接在这里:http://www.github.com/sliptree/bootstrap-tokenfield/archive/master.zip
答案 1 :(得分:0)
尝试此操作,您必须在index.html
中加入bootstrap-tokenfield.js
<input type="text" class="form-control" id="tokenfield" value="red,green,blue" />
$('#tokenfield').tokenfield({
autocomplete: {
source: ['red','blue','green','yellow','violet','brown','purple','black','white'],
delay: 100
},
showAutocompleteOnFocus: true
})