JavaScript 在 DNN 中

Question

我一直在尝试使用 DNN（我已经使用了两周）向网站添加 JavaScript。我目前使用的是 07.04.00 (353) 版。我试图将我的脚本粘贴到页面设置 -> 高级设置中的 header 和模块设置 -> 高级设置中的 header 中，但它似乎不起作用。我在下面发布了我想使用的脚本之一。

<script>
    var radiobtnType = "ensidig";
    var radiobtnOrient = "S";
    var radiobtnHeatCap = "100";
    //var tsvfilepath = data/ensidig_S_100.tsv

    $(".btnType").click(function () {
        radiobtnType = $(this).data('id');
        update_box();
        //var idPaaDenButtonDerBlevTrykketPaa = $(this).text() + $(this).data('id')
        //alert(idPaaDenButtonDerBlevTrykketPaa);
    });
    $(".btnOrientation").click(function () {
        radiobtnOrient = $(this).data('id');
        update_box();
    });
    $(".btnHC").click(function () {
        radiobtnHeatCap = $(this).data('id');
        update_box();
    });

    function update_box() {
        document.getElementById("foo2").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
        document.getElementById("pwd").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
    }
</script>

Answer 1

编辑：

如果您使用 DNN 4.9.1 或更高版本，则包含 jquery (http://www.dnnsoftware.com/community-blog/cid/135141/dotnetnuke-tips-and-tricks-11-using-jquery-in-dotnetnuke)。这意味着您只需要添加文档就绪包装（或按照 dnn link 中的建议添加 $(function() { /* code goes here */ });）。

--

首先确保您的页面包含 jQuery。如果没有，请包括它，例如通过使用 cdn:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

其次，将您的代码包装在 jQuery 的 ready() 函数中（参见 https://learn.jquery.com/using-jquery-core/document-ready/）。

<script>
$(document).ready(function() {

    var radiobtnType = "ensidig";
    var radiobtnOrient = "S";
    var radiobtnHeatCap = "100";
    //var tsvfilepath = data/ensidig_S_100.tsv

    $(".btnType").click(function () {
        radiobtnType = $(this).data('id');
        update_box();
        //var idPaaDenButtonDerBlevTrykketPaa = $(this).text() + $(this).data('id')
        //alert(idPaaDenButtonDerBlevTrykketPaa);
    });
    $(".btnOrientation").click(function () {
        radiobtnOrient = $(this).data('id');
        update_box();
    });
    $(".btnHC").click(function () {
        radiobtnHeatCap = $(this).data('id');
        update_box();
    });

    function update_box() {
        document.getElementById("foo2").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
        document.getElementById("pwd").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
    }

});
</script>

Answer 2

默认包含 DNN 07.04.xx 版本 JQuery 所以不用担心。

你的 JQuery 没有

就无法工作

$(document).ready(function() { 
     //JQ code here...
});

您也可以像下面这样使用。

<script language="javascript" type="text/javascript">

var radiobtnType = "ensidig";
var radiobtnOrient = "S";
var radiobtnHeatCap = "100";
//var tsvfilepath = data/ensidig_S_100.tsv

$(document).ready(function() {
    $(".btnType").click(function () {
        radiobtnType = $(this).data('id');
        update_box();
        //var idPaaDenButtonDerBlevTrykketPaa = $(this).text() + $(this).data('id')
        //alert(idPaaDenButtonDerBlevTrykketPaa);
    });
    $(".btnOrientation").click(function () {
        radiobtnOrient = $(this).data('id');
        update_box();
    });
    $(".btnHC").click(function () {
        radiobtnHeatCap = $(this).data('id');
        update_box();
    });
});
function update_box() {
    document.getElementById("foo2").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
    document.getElementById("pwd").value = "data/" + radiobtnType + "_" + radiobtnOrient + "_" + radiobtnHeatCap + ".tsv";
}
</script>

JavaScript 在 DNN 中

JavaScript in DNN

javascript

dotnetnuke