So drucken Sie den Wert des ausgewählten Kontrollkästchens nach der Übermittlung aus

Question

Dies ist meine Liste der Kontrollkästchen und Schaltflächen, die ich zum Übermitteln von Daten benötige.

<label>Access Locations </label>
     <br />


     <input type="checkbox" name="chk[]" id="check1" class="pl" value="INT" /> dummy1
     <input type="checkbox" name="chk[]" id="check2" class="pl" value="MV" /> dummy2
     <input type="checkbox" name="chk[]" id="check3" class="pl" value="FV" /> dummy3
     <input type="checkbox" name="chk[]" id="check4" class="pl" value="PS" /> dummy4

     <br />
     <h4 name ="checkboxvalues" style="color:green" id="result_checkbox"></h4>  
    
     <input type="hidden" name="employee_id_update" id="employee_id_update" />
     <input onclick="getCheckboxValue()" type="submit" name="insert" id="insert" value="Update" class="btn btn-success" />

Ich verwende die folgende Klasse, wenn ich auf die Schaltfläche klicke..

function getCheckboxValue() {

var l1 = document.getElementById("check1");
var l2 = document.getElementById("check2");
var l3 = document.getElementById("check3");
var l4 = document.getElementById("check4");

 
var res=" "; 
if (l1.checked == true){
  var pl1 = document.getElementById("check1").value;
  res = pl1 + ","; 
} 
else if (l2.checked == true ){
  var pl2 = document.getElementById("check2").value;
  res = res + pl2 + ","; 
}
else if (l3.checked == true){
document.write(res);
  var pl3 = document.getElementById("check3").value;
  res = res + pl3 + ","; 
}
else if (l4.checked == true){
  var pl4 = document.getElementById("check4").value;
  res = res + pl4 + ","; 
}

return document.getElementById("result_checkbox").innerHTML = "You have selected " + res ;

}

Obwohl ich bei der obigen Methode mehrere Kontrollkästchen aktiviert habe, sehe ich beim Klicken auf die Schaltfläche nur einen Wert in checkboxvalues, wie im Bild gezeigt.

Kann mir jemand sagen, wie ich meinen Code verbessern kann, um alle Werte anzuzeigen, wenn mehrere Kontrollkästchen aktiviert sind?

Wenn sowohl check1 als auch check2 ausgewählt sind, sollte die Ausgabe

lauten

Ausgabe:

You have selected INT,MV

Answer 1

您正在使用 if-else 梯形图，这意味着如果其中一个条件满足并被执行，其他块将被忽略。您可以使用多个 if 块来避免这种情况。

Answer 2

您正在使用 if else if 语句，因此一旦其中一个语句被执行，其余语句就不会被执行。您可以为每个复选框尝试一个 if 语句，它将完成工作。

var res=" "; 
if (l1.checked == true){
  var pl1 = document.getElementById("check1").value;
  res = pl1 + ","; 
} 
if (l2.checked == true ){
  var pl2 = document.getElementById("check2").value;
  res = res + pl2 + ","; 
}
if (l3.checked == true){
document.write(res);
  var pl3 = document.getElementById("check3").value;
  res = res + pl3 + ","; 
}
if (l4.checked == true){
  var pl4 = document.getElementById("check4").value;
  res = res + pl4 + ","; 
}