有没有办法调用函数的一部分

Question

我正在调用我在on click方法上编写的函数。我想知道我是否也可以在另一个onChange方法中调用该函数的一部分。

还是有其他方法可以做到这一点？

我的职能：

const filts = flatten => {
let new_filts = {
'site': $('#sites select option:selected')[0].value,,
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}

if (new_filts.site.length === 0)
new_filts.errors.push('Please select at least one <b>Site</b>.');

if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
}

if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filters;
}

我需要我的点击方法的整个功能，最后是：

$('#update').on('click', function() {
filters = filts(true);
});

update是一个按钮。我希望它调用所有 filts 函数。检查错误和所有错误。

我在site上还有另一种onChange方法.我希望在这里再次调用filts函数，但我只想能够调用函数的这一部分：

const filts = flatten => {
let new_filts = {
'site': 'google',
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}
if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filters;
}

我的onchange功能：

$('#site').on('change', function() {
filters = filts(true);
});

我不想在我的 onchange 中调用我的函数的错误检查。

有什么办法可以做到这一点吗？

Answer 1

您可以再传递一个参数，该参数将声明您要检查错误或不像这样

const filts = flatten, checkError => {
let new_filts = {
'site': $('#sites select option:selected')[0].value,,
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}
if(checkError){
if (new_filts.site.length === 0)
new_filts.errors.push('Please select at least one <b>Site</b>.');

if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
}
}
if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filters;
}

然后在两个不同的位置调用您的方法，例如

filts(true,true);

检查错误

filts(true,false);

不检查错误

Answer 2

为什么不直接向filts函数添加另一个参数以停止执行函数内的进一步指令？

$('#update').on('click', function() {
filters = filts(true, true);
});
$('#site').on('change', function() {
filters = filts(true, false);
});
const filts = (flatten, shouldContinue) => {
let new_filts = {
'site': $('#sites select option:selected')[0].value,,
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}
if (!shouldContinue) return;
if (new_filts.site.length === 0)
new_filts.errors.push('Please select at least one <b>Site</b>.');

if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
}

Answer 3

您可以将公共部分包装在其自己的函数中，然后在事件处理程序中调用它：

//the common part between the onclick handler and the onchange handler
function commonFunc(flatten) {
let new_filts = {
'site': 'google',
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}
if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filts;
}
//the filts function (onclick handler)
const filts = flatten => {
//call the commonFunc to get value of new_filts
let new_filts = commonFunc(flatten);
//do extra stuff with new_filts

if (new_filts.site.length === 0)
new_filts.errors.push('Please select at least one <b>Site</b>.');
if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
}


$('#site').on('change', function() {
filters = commonFunc(true);
});
$('#update').on('click', function() {
filters = filts(true);
});

Answer 4

如果您可以在文档中使用全局变量，它将是工作。

var globalEventCheck = false; // global variable
$('#update').on('click change', function(e) {
globalEventCheck = (e.type == 'click') ? true : false;
filters = filts(true);
});
const filts = flatten => {
let new_filts = {
'site': $('#sites select option:selected')[0].value,,
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
}
if (globalEventCheck) { // new condition
if (new_filts.site.length === 0) {
new_filts.errors.push('Please select at least one <b>Site</b>.');
}
if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
} // new condition end
if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filters;
}

Answer 5

很简单，你可以在不传递参数的情况下做到这一点，你也可以传递参数以获得进一步的逻辑。

const filts = () => {
//console.log(event.data.flatten); get your param value
let new_filts = {
'site': $('#sites select option:selected')[0].value,
'group_by': $('#group_by select option:selected')[0].value,
'date': 'date',
'topics': $('#topics select option:selected')[0].value,
'errors': []
};
if (event.type == 'click') {
if (new_filts.site.length === 0)
new_filts.errors.push('Please select at least one <b>Site</b>.');
if (new_filts.errors.length > 0) {
let message = '';
new_filts.errors.forEach(d => {
message += `<li>${d}</li>`
});
$.confirm({
title: 'All filts Are Required',
});
}
}
if (flatten) {
new_filts.site = new_filts.site.join('|');
}
return new_filters;
}
$('#site').click({ flatten: 'customValue1' }, filts);
$('#update').change({ flatten: 'customValue2' }, filts)