Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/445.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/83.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在js函数的同一页面上创建多个实例_Javascript_Jquery - Fatal编程技术网

Javascript 如何在js函数的同一页面上创建多个实例

Javascript 如何在js函数的同一页面上创建多个实例,javascript,jquery,Javascript,Jquery,考虑以下代码段: var from,to; to = $(".range-to-dt").persianDatepicker({ inline: true, minDate: new persianDate(cleanDate(serverDateTime)), altField: '.range-to-dt-alt', altFormat: 'YYYY/MM/DD', initialValue: false,

考虑以下代码段:

    var from,to;
    to = $(".range-to-dt").persianDatepicker({
    inline: true,
    minDate: new persianDate(cleanDate(serverDateTime)),
    altField: '.range-to-dt-alt',
    altFormat: 'YYYY/MM/DD',
    initialValue: false,
    onSelect: function (unix) {
        to.touched = true;
        if (from && from.options && from.options.maxDate != unix) {
            var cachedValue = from.getState().selected.unixDate;
            from.options = { maxDate: unix };
            if (from.touched) {
                from.setDate(cachedValue);
            }
        }
    }
});
from = $(".range-from-dt").persianDatepicker({
    inline: true,
    observer: true,
    minDate: new persianDate(cleanDate(serverDateTime)),
    altField: '.range-from-dt-alt',
    altFormat: 'YYYY/MM/DD',
    initialValue: false,
    onSelect: function (unix) {
        from.touched = true;
        if (to && to.options && to.options.minDate != unix) {
            var cachedValue = to.getState().selected.unixDate;
            to.options = { minDate: unix };
            if (to.touched) {
                to.setDate(cachedValue);
            }
        }
    }
});
如何在同一页面上多次(以几种不同的形式)使用js函数来正确执行

<form id="form1" ...>
   <input asp-for="DateTimeRange.StartDate"  ltr-input range-from-dt-alt">
   <input asp-for="DateTimeRange.EndDate"  ltr-input range-to-dt-alt">
</form>
<form id="form2" ...>
    <input asp-for="DateTimeRange.StartDate"   ltr-input range-from-dt-alt">
   <input asp-for="DateTimeRange.EndDate"  ltr-input range-to-dt-alt">
</form>


实际上,如何在js函数的同一页上创建多个实例?

您必须遍历包含2个输入的每个表单

您可以向表单中添加一个类而不是ID,例如

<form class="startEndForm">
   // Your 2 inputs here
</form>

请注意,
id
应始终是唯一的
id=“min date input”
@CarstenLøvboAndersen:是的,没错。我删除了它。。。现在呢?Uncaught TypeError:can not access property“toucted”,from是未定义的@ThéoBenoit:Uncaught TypeError:$(…)。forEach不是一个函数,但如果我使用每个函数,它就不是问题!啊,是的,我的错,它是jQuery中的.each()!我会编辑它;)@塞奥博诺伊特:非常感谢你的指导。但仍然存在一个问题。在两种形式中都有dt-alt的范围,这会导致信息同时进入两种形式。@farshid我编辑了答案,非常确定它来自“onSelect”,而不是从和分配到,输入良好。如果它不起作用,你能提供一个密码笔或什么的,这样我可以更好地帮助
$('.startEndForm').each(function () {
 $(this).find(".range-to-dt").persianDatepicker({
    inline: true,
    minDate: new persianDate(cleanDate(serverDateTime)),
    altField: '.range-to-dt-alt',
    altFormat: 'YYYY/MM/DD',
    initialValue: false,
    onSelect: function (unix) {
        var from = $(this).parent().find('.range-from-dt');
        var to = $(this);
        to.touched = true;
        if (from && from.options && from.options.maxDate != unix) {
            var cachedValue = from.getState().selected.unixDate;
            from.options = { maxDate: unix };
            if (from.touched) {
                from.setDate(cachedValue);
            }
        }
    }
});
$(this).find(".range-from-dt").persianDatepicker({
    inline: true,
    observer: true,
    minDate: new persianDate(cleanDate(serverDateTime)),
    altField: '.range-from-dt-alt',
    altFormat: 'YYYY/MM/DD',
    initialValue: false,
    onSelect: function (unix) {
        var from = $(this);
        var to = $(this).parent().find('.range-to-dt');
        from.touched = true;
        if (to && to.options && to.options.minDate != unix) {
            var cachedValue = to.getState().selected.unixDate;
            to.options = { minDate: unix };
            if (to.touched) {
                to.setDate(cachedValue);
            }
        }
    }
});
});