在初始页面加载时,自定义Javascript没有加载到mvc 4视图中

Custom Javascript not being loaded into mvc 4 view on initial page load

本文关键字:加载 mvc 视图 Javascript 自定义      更新时间:2023-09-26

我有一个使用jquery mobile的MVC 4应用程序,我还有自己的.JS文件,我的所有功能都存储在那里。

当我运行应用程序并导航到我选择的视图并查看我的页面源时,除了我的自定义脚本外,所有的脚本文件都已加载:/我已尝试将此脚本放置在视图中的不同位置,但仍然没有成功。

如果我对页面进行F5操作,那么我的自定义脚本文件就会被加载,并且一切都正常工作,那么我该如何在初始页面加载时将自定义脚本加载到我的页面中?

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="target-densitydpi=device-dpi; width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<title>Index</title>
<link href="~/Scripts/jquery.mobile-1.4.4.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.11.1.min.js"></script>
<script src="~/Scripts/jquery.mobile-1.4.4.min.js"></script>
<script src="~/Scripts/CustomScript/questions.js"></script>
</head>
<body>
<div data-role="page">
<form id="InspectionForm" method="post">
<input id="LoggedUserName" type="hidden" value="@Request.Cookies["UserInfo"]["UserName"]" />
<div data-role="navbar">
<ul>
<li><a href="@Url.Action("Index", "Inspection", new { SiteAuditID = Request.Cookies["SiteAuditID"].Value })">Back</a></li>
</ul>
</div>
        <div id="QuestionBuilder" style="padding: 10px 5px;">
            <div data-role="collapsible-set">
                @foreach (var item in Model)
                {
                    <div data-role="collapsible" data-theme="d" id="expandable-@item.QuestionID">
                        <h3 onclick="checkQuestion(@item.QuestionID)">@Html.DisplayFor(modelItem => item.QuestionNumber) . @Html.DisplayFor(modelItem => item.Question)</h3>
                        <table width="100%">
                            <tr>
                                <td>
                                    <div class="containing-element">
                                        <style>
                                            .containing-element .ui-slider-switch
                                            {
                                                width: 8em;
                                            }
                                        </style>
                                        <select name="QuestionOptional-@item.QuestionID" id="QuestionOptional-@item.QuestionID" data-role="slider" data-questionid="@item.QuestionID"  
                                                    onchange="SetQuestionOptional(@item.QuestionID,@item.SectionID,@item.SubSectionID)">
                                            <option value="off">Optional</option>
                                            <option value="on">Mandatory</option>
                                        </select>
                                    </div>
                                </td>
                                <td style="text-align: right;">
                                    <a  onclick="ShowDetails(@item.QuestionID)" href="#DetailsM"  data-rel="dialog" class="ui-shadow ui-btn ui-corner-all ui-btn-inline ui-mini">Details</a>
                                    <a  onclick="ShowComments(@item.QuestionID)" href="#CommentsM"  data-rel="dialog" class="ui-shadow ui-btn ui-corner-all ui-btn-inline ui-mini">Comments</a>
                                    <a  onclick="ShowActions(@item.QuestionID)" href="#ActionsM"  data-rel="dialog" class="ui-shadow ui-btn ui-corner-all ui-btn-inline ui-mini">Actions</a>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    @if (item.QuestionTypeID == Convert.ToInt32(questionType.SingleSelect))
                                    {
                                        <fieldset data-role="controlgroup">
                                            <input type="hidden" id="rBtnCheckedState" />
                                            @foreach (var opt in item.Options)
                                            {
                                                <input type="radio" name="radio-choice" id="radio-choice-@opt.OptionID" value="@opt.QuestionText"  data-mandatoryaction="@opt.IsMandatoryActions" 
                                                                data-mandatorycomment="@opt.IsMandatoryComments" />
                                                <label for="radio-choice-@opt.OptionID">@opt.QuestionText</label>
                                            }
                                        </fieldset>
                                    }
                                </td>
                            </tr>
                        </table>
                    </div>
                }
            </div>
        </div>
    </form>
</div>
<div id="DetailsM" data-role="dialog"> 
</div>
<div id="ActionsM" data-role="dialog">
</div>
<div id="CommentsM" data-role="dialog">
</div>
</body>
</html>

在下面的参考中给出您的完整路径地址

   <link href="~/Scripts/jquery.mobile-1.4.4.min.css" rel="stylesheet" />
   <script src="~/Scripts/jquery-1.11.1.min.js"></script>
   <script src="~/Scripts/jquery.mobile-1.4.4.min.js"></script>
   <script src="~/Scripts/CustomScript/questions.js"></script>