复选框循环上的JavaScript警报

Question

I have a problem in my code.

I want to write a code of java alert while checkbox is not checked.

I have a loop of checkboxes

here is code

 <?php 
 for ($i=0; $i<count($chk); $i++) {

 echo "<input type='checkbox' name='pr' value=''/>".$chk[$i];
 echo "</br>";

 }
?>

and here is JavaScript

<script>

var tags = document.getElementsByName('pr'),
    value = '', i = 0;

for( ; i < pr.length; i++ )
{
    if( pr[i].checked=='' ) {

alert("Please Check All Checkboxes");
    }
}
    </script>

I want that the checkbox which are echo from loop is all checked then is proceed it to next page. If anyone checkbox is not checked it show an alert message

Problem: If i am not checked anyone checkbox it proceed, and i want it would not proceed if anyone checkbox is not checked

Answer 1

var allAreChecked = true;
for( ; i < pr.length; i++ )
{
    if( pr[i].checked=='' ) {

        allAreChecked = false;
    }
}
if (!allAreChecked) {
    alert("Please Check All Checkboxes");
}

Or,

var allAreChecked = true;
for( ; i < pr.length; i++ )
{
    if( pr[i].checked=='' ) {

        alert("Please Check All Checkboxes");
        break;
    }
}

Or, more concisely, and legibly:

function checked(element) {
    return element.prop('checked');
}
if (!Array.prototype.every(tags, checked)) {
    alert("Please Check All Checkboxes");
}

EDIT: proof it works:

document.getElementById('test').addEventListener('click', function() {
  var pr = document.getElementsByName('pr'),
      i = 0;

  var allAreChecked = true;
  for( ; i < pr.length; i++ )
  {
    if( pr[i].checked=='' ) {
      allAreChecked = false;
    }
  }
  if (!allAreChecked) {
    alert("Please Check All Checkboxes");
  } else {
    alert("All OK");
  }
});

<input type='checkbox' name='pr' value=''/>
<input type='checkbox' name='pr' value=''/>
<input type='checkbox' name='pr' value=''/>
<button id="test">Test</button>

</div>