当使用局部视图时,只添加一次javascript代码

to have a javascript code only added once when using partial view

本文关键字:一次 代码 javascript 添加 用局 视图      更新时间:2023-09-26

我有一个局部视图,它本身是在局部视图。最内部部分视图中的内容可以多次呈现。我有一个javascript代码,这是重要的只有最内部的视图。因此,当内容被渲染不止一次时,javascript代码被添加两次,事件被调用两次。如

var isDccmAndReady = '@isDccmAndReady';
$(document).ready(function() {
    $(function() {
        $("input[name='ReportDate']").change(function() {
            if (isDccmAndReady) {
                var d = new Date();
                var currentDate = (d.getMonth() + 1) + "/" + +d.getDate() + "/" + d.getFullYear();
                var dateSelected = $(this).val();
                if (new Date(dateSelected) > new Date(currentDate)) {
                    var answer = confirm("The contract has been already reported, are you sure you wish to continue?");
                if (answer) {
                    return true;
                } else {
                    $(this).val('@Model.OriginalReportDate.Value.ToShortDateString()');
                    return false;
                }
            }
        }
        return false;
    });
});

现在,如果文本框被嵌入两次,onchange事件会在其中一个文本框发生变化时被调用两次。如何规避这个问题?

我不确定你想要什么,如果你想一个函数只运行一次,你可以使用下划线"once" function:

var newfunction = _.once(yourfunction);
newfunction();
newfunction();

如果您的目的是防止事件处理程序在元素中添加多次,您可以先取消绑定事件,然后再重新绑定,如:

$("#someselector").unbind("change").change(function(){
})

终于修好了。我在分部视图中添加了以下javascript,其中调用了最内层的分部,以便javascript在dom中注册一次。我还在文本框中添加了几个数据属性,其值在javascript

中需要。
$(document).ready(function () {
    $(function () {
        $("input[name='ReportDate']").change(function () {
            if ($(this).attr('data-isDccmAndReady')) {
                var d = new Date();
                var currentDate = (d.getMonth() + 1) + "/" + +d.getDate() + "/" + d.getFullYear();
                var dateSelected = $(this).val();
                if (new Date(dateSelected) > new Date(currentDate)) {
                    var answer = confirm("The contract has been already reported, are you sure you wish to continue?");
                    if (answer) {
                        return true;
                    } else {
                        $(this).val($(this).attr('data-originalReportDateVal'));
                        return false;
                    }
                }
            }
            return false;
        });
    });
});