Tai*_*mur 6 javascript css jquery ruby-on-rails twitter-bootstrap
我正在尝试使用slider()jQuery UI 的功能,并在控制台中不断收到以下错误:
TypeError: undefined不是函数(评估jQuery('#slider').slider())
我肯定正确地链接到jQuery UI javascript和CSS文件 - 当我查看页面源时,它们都在那里.为什么我仍然会收到此错误？
如果有任何用处,我使用Rails和一些Bootstrap的东西.这是javascript代码:
<script type="text/javascript">
$(document).ready(function(){
$('#slider').slider();
});
</script>
谢谢
这是<head>:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../../docs-assets/ico/favicon.png">
<link href="/assets/jquery.ui.core.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.theme.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.accordion.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.menu.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.autocomplete.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.button.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.datepicker.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.resizable.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.dialog.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.progressbar.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.selectable.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.slider.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.spinner.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.tabs.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.tooltip.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.base.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery.ui.all.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/application.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/bootstrap-theme.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/bootstrap-theme.min.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/bootstrap.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/bootstrap.min.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/companies.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/jquery-ui.min.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/scaffolds.css?body=1" media="screen" rel="stylesheet" />
<link href="/assets/bootstrap.css?body=1" media="screen" rel="stylesheet" />
<script src="/assets/jquery.js?body=1"></script>
<script src="/assets/jquery_ujs.js?body=1"></script>
<script src="/assets/bootstrap.js?body=1"></script>
<script src="/assets/bootstrap.min.js?body=1"></script>
<script src="/assets/companies.js?body=1"></script>
<script src="/assets/jquery-1.11.0.min.js?body=1"></script>
<script src="/assets/jquery-ui.min.js?body=1"></script>
<script src="/assets/application.js?body=1"></script>
<title>New Company - OE Fort by Oxford Entrepreneurs</title>
<meta content="authenticity_token" name="csrf-param" />
<meta content="FcOEJfo8vcCzR+Dq+5zOVSvm7Npfo+R+FoXrEPpV3js=" name="csrf-token" />
<!-- Bootstrap core CSS -->
<link href="../../../app/assets/stylesheets/bootstrap.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js" type="text/javascript"></script>
<link href="../../../app/assets/stylesheets/jquery-ui.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="../../jumbotron.css" rel="stylesheet">
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="../../docs-assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<link href='http://fonts.googleapis.com/css?family=Oswald:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,600,300' rel='stylesheet' type='text/css'>
<script type="text/javascript">
jQuery(document).ready(function(){
$('#slider').slider();
});
</script>
</head>
我猜测在加载JQuery之前加载这个函数会导致错误(因此你看到undefined错误的原因--JQuery是未定义的)
你能详细说明你加载代码的方式吗？你可以发贴你的<head>标签吗？
可能的原因可能是:
$("#slider") 不是有效的元素| 归档时间： |
|
| 查看次数： |
35785 次 |
| 最近记录： |