Question

我正在搜索许多博客，但我不清楚，使用哪个版本的jQuery和bootstrap。在我的代码中，我面临的错误就像datepicker不是一个函数。我不清楚这里到底缺少什么。

我已经提到过，index.cshtml，layout和bundle配置代码块。如果有人向我提供可以区分jQuery和bootstrap小部件的教程，那么它将会非常有用。

我需要在头部添加什么
渲染脚本？

代码：

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Index</h2>

<!doctype html>
<html lang="en">
<head>          
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
    <script  type="text/javascript">    
     $(document).ready(function () {
       $( '#datepicker' ).datepicker();
     });
  </script>
</head>
<body>     
<p>Date: <input type="text" id="datepicker" /></p>      
</body>
</html> 
layout.cshtml:
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>       
    <script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>       
    <script src="~/Scripts/bootstrap.min.js"></script>
    <script src="~/Scripts/bootstrap-datepicker.min.js"></script>  <script src="~/Scripts/jquery.validate.min.js"></script>
</head>
<body>
    @RenderBody()       
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>
</html>   
using System.Web;
using System.Web.Optimization;
namespace DatePickerTest
{
    public class BundleConfig
    {
        // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));    
            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));    
            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.unobtrusive*",
                        "~/Scripts/jquery.validate*"));    
            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                        "~/Content/themes/base/jquery.ui.core.css",
                        "~/Content/themes/base/jquery.ui.resizable.css",
                        "~/Content/themes/base/jquery.ui.selectable.css",
                        "~/Content/themes/base/jquery.ui.accordion.css",
                        "~/Content/themes/base/jquery.ui.autocomplete.css",
                        "~/Content/themes/base/jquery.ui.button.css",
                        "~/Content/themes/base/jquery.ui.dialog.css",
                        "~/Content/themes/base/jquery.ui.slider.css",
                        "~/Content/themes/base/jquery.ui.tabs.css",
                        "~/Content/themes/base/jquery.ui.datepicker.css",
                        "~/Content/themes/base/jquery.ui.progressbar.css",
                        "~/Content/themes/base/jquery.ui.theme.css"));
        }
    }
}

jQuery日期选择器和引导日期选择器之间的区别

0 个答案: