javascript - 如何以及在何处将 JQuery 添加到 DotnetNuke(DNN) 的模块元素中？

Question

我是 DotnetNuke 的初学者。我正在创建一个元素，它提供一个可以添加到基于 DotnetNuke 的网站的模块。

我已经在我的 IIS 服务器中配置了 www.dnndev.me，并在它的 DesktopModule 文件夹中创建了元素。我可以成功创建、构建模块并将其添加到 www.dnndev.me，但我不知道在模块元素的解决方案资源管理器中的何处添加 JQuery。

1- 我应该在哪里添加我的 JS 和 CSS 文件？我尝试通过添加文件夹“Assets”、“Assets/CSS”、“Assets/JS”并将我的文件放在我的解决方案资源管理器中。

2- 如何在 ascx 页面中包含 JS/CSS 文件？跟着我累了

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="View.ascx.cs" Inherits="CustomerDemo.Modules.CustomerDemo.View" %>
<dnn:DnnCssInclude runat="server" FilePath="~/DesktopModules/CustomerDemo/Assets/JS/fullcalendar.min.js" />
<dnn:DnnCssInclude runat="server" FilePath="~/DesktopModules/CustomerDemo/Assets/JS/jquery-ui-timepicker-addon.js" />

通过上述方式 .js 显示在我的网页源中，但它没有调用。但是，如果我按照以下方式尝试，它会起作用

<script type="text/javascript">
    $(document).ready(function () { $.getScript("http://www.dnndev.me/DesktopModules/CustomerDemo/Assets/JS//jquery-ui-timepicker-addon.js?_=1483026285109", function () {
            if ($('.mmdd').length > 0) {
               $(".mmdd ").datetimepicker();
            }
        });
    });
</script>

有人可以建议我如何以及在何处放置 .js 和 '.css' 文件以及如何将它们包含在元素中吗？

I am using: Visual Studio 2015 & DotnetNuke 8 Commnunity

文件路径困惑:

这是我通过右键单击打开时文件夹的物理位置-->使用文件夹资源管理器打开

F:\websites\dnndev.me\DesktopModules\CustomerDemo\CustomerDemo\Assets

但是当我将 CSS 或 JS 文件从文件资源管理器拖到 ascx 设计页面时，它使用这个位置:“~\DesktopModules\CustomerDemo\Assets\file.css "

您可以看到物理路径有 2 个 CustomerDemo 文件夹，而从解决方案资源管理器中拖动的文件的路径只有 1 个 CustomerDemo 文件夹。

我不明白这个机制。我应该使用哪一个？有人可以为此清除我的想法吗？

作为建议之一，我已经尝试过这种方式，但看起来我遗漏了一些东西

Answer 1

使用客户端资源管理的 DnnJsInclude 控件来注册脚本，而不是 DnnCssInclude。

在你的 .ascx 中:

<%@ Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>

<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/CustomerDemo/Assets/JS/fullcalendar.min.js" />

或者在您后面的代码中，您可以改为使用 ClientResourceManager API:

protected void Page_PreRender(object sender, EventArgs e)
{
    ClientResourceManager.RegisterScript(this.Page, base.ControlPath + "/Assets/JS/fullcalendar.min.js", 100);
    ClientResourceManager.RegisterScript(this.Page, base.ControlPath + "/Assets/JS/jquery-ui-timepicker-addon.js", 100);
    ClientResourceManager.RegisterStyleSheet(this.Page, base.ControlPath + "/Assets/CSS/module.css", 100);
}