Jquery动态变化



我不是Jquery的专家,我的开发人员不可用。我正在使用https://jqcron.arnapou.net/demo/。这很好用。代码如下,

$(function(){
$('.example7').jqCron({
enabled_minute: true,
multiple_dom: true,
multiple_month: true,
multiple_mins: true,
multiple_dow: true,
multiple_time_hours: true,
multiple_time_minutes: true,
default_period: 'week',
default_value: '*/14 */2 */3 * *',
bind_to: $('.example7-input'),
bind_method: {
set: function($element, value) {
$element.val(value);
}
},
no_reset_button: false,
lang: 'en'
});
});

html

<div class="example7"></div> <input class="example7-input" />

我的问题

我需要将上述函数添加到许多div中,如下所示,

<div class="example7"></div> <input class="example7-input" />
<div class="example8"></div> <input class="example8-input" />
<div class="example8"></div> <input class="example8-input" />

解决方案是,当单击example7div时,该值只需要应用于example7input的输入框。因此,每个div需要显示不同的值。所有这些都使用相同的Jquery函数。

那么我如何修改jQuery函数

您可以尝试以下片段:

$(function () {
var classes_arr = ["example7", "example8", "example9"];
for (var item in classes_arr) {
$("." + classes_arr[item] + "").jqCron({
enabled_minute: true,
multiple_dom: true,
multiple_month: true,
multiple_mins: true,
multiple_dow: true,
multiple_time_hours: true,
multiple_time_minutes: true,
default_period: "week",
default_value: "*/14 */2 */3 * *",
bind_to: $("." + classes_arr[item] + "-input"),
bind_method: {
set: function ($element, value) {
$element.val(value);
},
},
no_reset_button: false,
lang: "en",
});
}
});

在这个代码段中,所有元素都分组在一个数组中。如果需要添加更多的元素,则在classes_arr数组中添加它们的类名。

所以你的函数应该是这样的:

Javascript

$(function () {
$('.example7').jqCron({
enabled_minute: true,
multiple_dom: true,
multiple_month: true,
multiple_mins: true,
multiple_dow: true,
multiple_time_hours: true,
multiple_time_minutes: true,
default_period: 'week',
default_value: '*/14 */2 */3 * *',
bind_to: $('.example7-input, .example8-input, .example9-input'),
bind_method: {
set: function ($element, value) {
$element.val(value);
}
},
no_reset_button: false,
lang: 'en'
});
});

HTML

<div class="example7"></div> <input class="example7-input" />
<div class="example8"></div> <input class="example8-input" />
<div class="example9"></div> <input class="example9-input" />

最新更新