Question

我正在使用asp.net mvc，因为我使用了部分视图。我有一个问题，即日期选择器在IE上正常工作，但它不适用于Mozilla Firefox。我使用的是：

<link href="<%=ResolveClientUrl("~/Scripts/Themes/ui-lightness/jquery-ui-1.7.2.custom.css")%>" rel="stylesheet" type="text/css" />
<script src="../Scripts/jquery-1.3.2.js" type="text/javascript"></script>

<script src="../Scripts/ui.core.js" type="text/javascript"></script>

<script src="../Scripts/ui.datepicker.js" type="text/javascript"></script>

并且视图页面上的功能是：

          <script type="text/javascript">

                         $(document).ready(function() {
                             $("#txtTransationDate").datepicker();
                         });
                        </script>

                        <input id="txtTransationDate" name="txtTransationDate" type="text" />

请建议我。提前谢谢。

Answer 1

以下代码每次都在每个浏览器中运行。

<html>
<head>
<title>test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/ui-lightness/jquery-ui.css" type="text/css" 

rel="stylesheet">
<style>
input { width:300px; }
</style>
</head>
<body>

<script type="text/javascript">
    $(document).ready(function() {
        $("#txtTransationDate").datepicker();
    });
</script>
<h2>Date Picker Test</h2>
<input id="txtTransationDate" name="txtTransationDate" type="text" value="Click here to show the date picker!" />
</body>
</html>

因此，让我们检查您的代码与此代码之间的差异。

首先，我正在使用Google CDN 对于我的js和css文件，这是在我的背景下确保我测试我的文件正在下注加载。它也使它更容易测试;）
我也在使用jQuery 1.4.2（最新版本版本）和1.8.2最新的jQuery UI 版本
问题是哪个版本你在使用jQuery吗？是的 jQuery UI和jQuery版本每个浏览器兼容吗？
你的css版本1.7.x这往往是建议使用jQuery UI版本你拿起来也可能更新比jQuery版本。
我使用完全相同的JavaScript 和相同的输入标签（添加出于此目的的属性检验）。
这个问题似乎很明显不驻留在js和html中你在这里提供。
我也向你展示了我的全部上下文。 Firefox也很挑剔，IE也是但不是同样的东西。那样的其他js或者有可能格式错误的标签干扰了FF？

尝试在静态htm页面中运行我的测试。如果它有效，我会尝试的第一件事就是改变我正在使用的脚本。

另一方面，如果您不想或不能在最终应用中使用Google CDN。我建议使用这些辅助方法来包含css和js文件。因为很难预见MVC应用程序可能具有的所有可能的URL级别（/）。

/// <summary>
/// Include a javascript file.
/// </summary>
/// <param name="path"></param>
/// <param name="url"></param>
/// <returns></returns>
public static string IncludeJavascript(this UrlHelper url, string path)
{
    return "<script src=\"" + url.Content(path) + "\" type=\"text/javascript\"></script>";
}

/// <summary>
/// Include a css file.
/// </summary>
/// <param name="path"></param>
/// <param name="url"></param>
/// <returns></returns>
public static string IncludeStylesheet(this UrlHelper url, string path)
{
    return "<link href=" + url.Content(path) + " rel=\"stylesheet\" type=\"text/css\" />";
}

用法：

<%= Url.IncludeJavascript("~/Scripts/jquery.js") %>
<%= Url.IncludeStylesheet("~/Scripts/Themes/jquery.css") %>

两个不同浏览器中的日期选择器

1 个答案: