C# 共享视图上的ASP.Net MVC4 JavaScript未从链接执行

C# 共享视图上的ASP.Net MVC4 JavaScript未从链接执行,c#,jquery,asp.net-mvc,C#,Jquery,Asp.net Mvc,我有一个简单的ASP.NETMVC4应用程序,专为移动应用而设计。该应用程序使用内置的C#Visual Studio移动应用程序模板,该模板附带表单身份验证和用于处理登录的帐户视图和控制器 该应用程序具有内置的登录视图、主菜单和我自己创建的航班视图 我希望CSS类为“date”的所有html元素都是日期时间选择器,因此在加载JQuery捆绑包之后,我通过JQuery UI将以下JavaScript放入Shared/_Layout.cshtml视图中: <script type="text/

我有一个简单的ASP.NETMVC4应用程序,专为移动应用而设计。该应用程序使用内置的C#Visual Studio移动应用程序模板,该模板附带表单身份验证和用于处理登录的帐户视图和控制器

该应用程序具有内置的登录视图、主菜单和我自己创建的航班视图

我希望CSS类为“date”的所有html元素都是日期时间选择器,因此在加载JQuery捆绑包之后,我通过JQuery UI将以下JavaScript放入Shared/_Layout.cshtml视图中:

<script type="text/javascript">
            $(document).ready(function () {
                alert("test");
                $('.date').datepicker({ dateFormat: "dd/mm/yy" });

            });
</script>
为了清楚起见,单击链接会按预期呈现视图,但它不会运行我的JavaScript。我唯一能让脚本运行的方法就是手动输入URL

我已经尝试将脚本移动到实际的Flight视图中,但是JQuery没有加载,因为它加载在Shared/_Llayout.cshtml视图的scripts部分

@Scripts.Render("~/bundles/jquery", "~/bundles/jquerymobile")
 @Scripts.Render("~/bundles/jquery")
 @Scripts.Render("~/bundles/jqueryui")
当我将链接悬停时,显示的URL是localhost:63891/Flight,但当我实际单击时,URL会更改为localhost:63891/#/Flight。我不确定这是为什么,是否相关

单击链接时如何运行脚本


编辑:我想我有这个问题,但没有人回答他/她的问题

尝试一个简单的标签。也许它能起作用:

<a href = "~/Flight/">Flights</a>

听起来更像是部分加载了“航班”页面(例如通过ajax)

在查找XHR请求之前,您可以在单击“Flight”链接时查看URL是否在更改,如果没有更改,则表示“Flight”页面已部分加载,反之则为false(可以在AJAX中加载内容并更改URL)

然后,您可以使用开发人员工具(例如Chrome)查找XHR请求。 点击F12(或右键单击“检查元素”),查看控制台上是否有XHR请求。

验证“Log XMLHttpRequests”选项是否已启用(在设置中)。


如果移动站点使用JQM,并且从评论中可以看出它使用JQM。试用

$(document.bind('pageinit')

而不是

$(document).ready()


我接受了@Igarioshka的答案,因为这将是这个问题的正常答案,并提供了关于如何在Jquery移动应用程序中不使用document.ready的良好信息

实际的问题是我从VS中的移动模板创建了这个站点,它自动添加了JQuery Mobile。然后我继续开发,直到我需要一个日历弹出窗口。从我在线发现的情况来看,这需要jqueryui和JQuery(full),因此我在SHared/_layout.cshtml视图中现有的JQM调用下添加了render调用

@Scripts.Render("~/bundles/jquery", "~/bundles/jquerymobile")
 @Scripts.Render("~/bundles/jquery")
 @Scripts.Render("~/bundles/jqueryui")
然后,我添加了用于添加数据采集器的脚本。由于jquerymobile使用AJAX处理@Igarioshka详细介绍的所有内容,因此不会触发这种情况。但是,将脚本更改为
$(document.bind('pageinit',函数(事件,数据){

仍然没有启动。这似乎是因为脚本是在加载完整的JQuery之后启动的。因此,在加载完整的JQuery之前更改代码顺序以使用pageinit事件可以解决此问题

@Scripts.Render("~/bundles/jquery", "~/bundles/jquerymobile")
@RenderSection("scripts", required: false)
        <script type="text/javascript">
            $(document).bind('pageinit', function (event, data) {
                $('.date').datepicker({ dateformat: "dd/mm/yy" });
            });
        </script>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render(“~/bundles/jquery”,“~/bundles/jquerymobile”)
@RenderSection(“脚本”,必需:false)
$(文档).bind('pageinit',函数(事件,数据){
$('.date').datepicker({dateformat:“dd/mm/yy”});
});
@Scripts.Render(“~/bundles/jquery”)
@Scripts.Render(“~/bundles/jqueryui”)
这对我来说意味着pageinit事件是特定于JQuery Mobile的,在全面的JQuery中不可用,这在尝试学习跨平台web开发的统一方法时是一个耻辱


我不确定这是否意味着我应该放弃JQuery Mobile,因为我已经使用了完整的JQuery Mobile,或者它是否仍然有用,因为它有优化功能等等。

听起来像是一个奇怪的缓存问题。如果按Ctrl+F5(硬刷新)点击链接后,它是否工作?您确定当url
http://localhost:63891/Flight
是手动输入的吗?可能是调用了另一个操作,返回了另一个视图吗?您确定MVC站点的移动版本没有对vie进行某种部分加载吗ws,如果是这种情况,那么浏览器可能不会在初始加载后实际运行您定义的脚本部分?@mattytomo-yeah在页面上单击“重新加载”确实会运行脚本,但在返回主菜单并再次单击之后,它不会运行again@Andrei是的,我确定,因为飞行控制只有一个动作我想你的意思是,但这也有同样的问题。不。我的意思是我写的东西,它对我有效。但是,它似乎不能解决问题。好吧,你写的东西一般不会起作用。你需要使用@Url.Content来确保虚拟路径正确地转换为物理路径。事实上你是对的。但是我使用这种方法在我的主菜单中的_layout.cshtml文件中寻址,它在这种情况下工作。虽然当我悬停链接时,URL会发生变化,但显示的URL是localhost:63891/Flight,但当我实际点击URL时,更改为localhost:63891/#/Flight是否相关?Chrome开发控制台中没有显示任何内容,这意味着“Flight”页面e没有完全加载。如果你说在开发控制台上没有记录XHR请求,可能“Flight”页面的内容已经加载到页面上,并在你点击链接时显示出来(一些处理“click”事件的js)。很抱歉,我设置了Chrome。现在设置正确了,我确实看到XHR已完成加载:“.因此,出于某种原因,它正在使用AJAX进行简单的锚定标记单击。你听起来好像在那里找到了什么东西。我尝试过它,但它现在完全停止了发射,所以我不确定我是否正在钩住它