剃刀中非常基本的jquery datepicker [英] Very basic jquery datepicker in Razor

查看:159
本文介绍了剃刀中非常基本的jquery datepicker的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在视觉工作室2010年MVC4剃刀微软模板。我从jquery网站下载了jquery工具包,当我打开index.html时它工作。但是,当我将剃须刀项目更改为jquery下载(将所有JS文件,图像和css文件移动到正确的位置)并添加以下代码(在html情况下工作)

 < meta http-equiv =Content-Typecontent =text / html; charset = iso-8859-1/> 
< title> jQuery UI示例页面< / title>
< link type =text / csshref =〜/ Content / ui-lightness / jquery-ui-1.8.24.custom.css =stylesheet
< script type =text / javascriptsrc =〜/ Scripts / jquery-1.8.2.min.js>< / script>
< script type =text / javascriptsrc =〜/ Scripts / jquery-ui-1.8.24.custom.min.js>< / script>
< script type =text / javascript>
$(function(){

// Datepicker
$('#datepicker')。datepicker({
inline:true
});

});
< / script>

< / head>
< body>


<! - Datepicker - >
< h2 class =demoHeaders> Datepicker< / h2>
< div id =datepicker>< / div>


< / body>

页面上没有任何东西出现在文本Datepicker上。我已经看过其他的东西,没有什么似乎在做这个伎俩。任何建议?

解决方案

在浏览器中检查网络控制台,我敢打赌它正在获得 404 当尝试加载您的css和js文件时出错。因此,它不适用于日历的风格,甚至不适用于最初隐藏日历的js。尝试以这种方式引用它们:

 < link type =text / csshref ='@ Url.Content(〜 /Content/ui-lightness/jquery-ui-1.8.24.custom.css)'rel =stylesheet/> 
< script type =text / javascriptsrc ='@ Url.Content(〜/ Scripts / jquery-1.8.2.min.js)'>< / script>
< script type =text / javascriptsrc ='@ Url.Content(〜/ Scripts / jquery-ui-1.8.24.custom.min.js)'>< / script>

使用 Url.Content 将解析您的网址正确。


I am in the visual studio 2010 MVC4 razor microsoft template. I downloaded the jquery "kit" from the jquery site and it works when I open up the index.html. However, when I change my razor project to look like the jquery download (move all the JS files, images, and css files into the right places) and add in the following code (which works in the html case)

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>jQuery UI Example Page</title>
    <link type="text/css" href="~/Content/ui-lightness/jquery-ui-1.8.24.custom.css" rel="stylesheet" />
    <script type="text/javascript" src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery-ui-1.8.24.custom.min.js"></script>
    <script type="text/javascript">
        $(function () {

            // Datepicker
            $('#datepicker').datepicker({
                inline: true
            });

        });
    </script>

</head>
<body>


    <!-- Datepicker -->
    <h2 class="demoHeaders">Datepicker</h2>
    <div id="datepicker"></div>


</body>

Nothing shows up on the page expect for the text Datepicker. I have looked through everything else and nothing seems to be doing the trick. Any suggestions?

解决方案

Check the Network console in your browser, I bet it is getting 404 errors when it's trying to load your css and js files. Because of this, it doesn't apply the style for the calendar, or even the js to have it hidden initially and all that. Try referencing them this way:

<link type="text/css" href='@Url.Content("~/Content/ui-lightness/jquery-ui-1.8.24.custom.css")' rel="stylesheet" />
<script type="text/javascript" src='@Url.Content("~/Scripts/jquery-1.8.2.min.js")'></script>
<script type="text/javascript" src='@Url.Content("~/Scripts/jquery-ui-1.8.24.custom.min.js")'></script>

Using Url.Content will resolve your URLs correctly.

这篇关于剃刀中非常基本的jquery datepicker的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆