JavaScript中的條件組合

我的表單上有5個複選框，每個複選框都有一個單獨的條件來驗證。用戶可以選擇任意數量的複選框。對於每個選中的複選框，我必須執行相應的條件。實施例JavaScript中的條件組合

如果checkbox1然後條件1

如果checkbox2然後條件2

如果checkbox3然後條件3

如果checkbox1 & checkbox2然後條件1 &條件2

如果checkbox1 & checkbox3然後條件1 &條件3

如果checkbox2 & checkbox3然後條件2 & condition3

等等... 直到所有checboxes

我想避免多個的所有組合的if語句任何人都可以建議我更好邏輯相同在JavaScript中。

TIA

來源

2017-08-31 Beginner

好吧，您只需單獨檢查每個複選框，然後單獨執行每個條件......任何時候cb1被選中，condtion1就是你通過condition1所表達的任何東西（所以，它是5如果語句） - 你不能避免5個if語句的5複選框 –

你能顯示你的代碼嗎？前三個if語句應該是你所需要的。 – 4castle

@ 4castle - 問題中有5個，在這個例子中有3個：p我覺得所有的Monty Python都混合使用了3和5：p –

處理每個條件單獨

您可以從輸出看你的「條件」與複選框狀態結婚了

function blah(checkbox1, checkbox2, checkbox3, checkbox4, checkbox5, str) { 
 
    if(checkbox1) { 
 
     str += ':condition1'; 
 
    } 
 
    if(checkbox2) { 
 
     str += ':condition2'; 
 
    } 
 
    if(checkbox3) { 
 
     str += ':condition3'; 
 
    } 
 
    if(checkbox4) { 
 
     str += ':condition4'; 
 
    } 
 
    if(checkbox5) { 
 
     str += ':condition5'; 
 
    } 
 
    return str; 
 
} 
 
console.log(blah(1, 0, 0, 0, 0, 'checkbox1')); 
 
console.log(blah(0, 1, 0, 0, 0, 'checkbox2')); 
 
console.log(blah(0, 0, 1, 0, 0, 'checkbox3')); 
 
console.log(blah(1, 1, 0, 0, 0, 'checkbox1, checkbox2')); 
 
console.log(blah(1, 0, 1, 0, 0, 'checkbox1, checkbox3')); 
 
console.log(blah(1, 1, 1, 0, 0, 'checkbox1, checkbox2, checkbox3'));

來源

2017-08-31 05:46:02

你可以試試將每個複選框的條件放入其自己的函數中，並通過複選框的0123存儲該函數爲JavaScript對象的關鍵：

function run() { 
 
    var checkboxes = document.querySelectorAll('input.condition:checked') 
 

 
    var conditions = { 
 
    'one': function(data) { 
 
     return data.one; 
 
    }, 
 
    'two': function(data) { 
 
     return data.two; 
 
    }, 
 
    'three': function(data) { 
 
     return data.three; 
 
    } 
 
    }; 
 

 
    var someJson = { 
 
    'one': true, 
 
    'two': true, 
 
    'three': false 
 
    }; 
 

 
    if (!checkboxes.length) { 
 
    console.log('Please select at least one checkbox'); 
 
    return; 
 
    } 
 

 
    for (var i = 0; i < checkboxes.length; i++) { 
 
    var checkbox = checkboxes[i]; 
 
    var id = checkbox.id; 
 
    var conditionFunc = conditions[id]; 
 
    if (typeof conditionFunc !== 'function' || !conditionFunc(someJson)) { 
 
     console.log('Failed on condition for checkbox: ' + id); 
 
     return; 
 
    } 
 
    } 
 
    console.log('Completed all conditions successfully!'); 
 
}

<input type="checkbox" class="condition" id="one">One</input><br> 
 
<input type="checkbox" class="condition" id="two">Two</input><br> 
 
<input type="checkbox" class="condition" id="three">Three</input><br> 
 
<button onclick="run()">Run</button>

來源

2017-08-31 05:53:44

這就是我會做（以方便使用它需要的jQuery）：添加數據屬性，以便所有的複選框是他們配對一個條件（就像你說的：connect1到condition1）。在一個對象，其中的鍵在數據所用的數字存儲您所有的條件屬性： HTML：

<input type="checkbox" data-number="1">

的JavaScript：

var conditions = { 
    "1": true //some condition; 
}

然後保持在軌道上你選中的複選框：

var checked = []; 
$(".input[type='checkbox']").on("click", function(){ 
    var number = $(this).attr("data-number"); 
    var index = checked.indexOf(number); 
    if(index > -1){ 
     arr.splice(index, 1); //delete if already there (unchecked) 
    } else { 
     arr.push(index); //add if not already there (checked) 
    } 
});

現在如何確定要應用的條件：請確保將以下代碼在函數內部，並隨時調用它，當你需要檢查的條件：

var passed = true; 
for(var i = 0; i < checked.length && passed; i++){ 
    passed = conditions[checked[i].toString()]; // Assuming that condition1, ..., condition n must be true 
} 

if(passed){ 
    alert("All conditions where true"); 
} else { 
    alert("One condition was false"); 
}

請注意：你可能要重新定義的條件，只要你檢查對象，因爲DOM操作希望自動更新的條件目的。如果有不明之處，請在評論中提問。這個解決方案能夠處理無限的條件（不超過javascript默認的最高數字，但仍然足夠）

來源

2017-08-31 06:26:10

JavaScript中的條件組合

回答

相關問題