如何在未提交表单的情况下获得选中或取消选中复选框的值 - How to get value of checkbox on check or uncheck without submit form

How to get value of checkbox on check or uncheck without submit form

我想在有人选中或取消选中复选框时更改值。下面是我的代码:

<?php 
    if($params['status'] == "2"){ 
?>
        <div class="pull-right" id="confirm-ship">
            <input type="checkbox" class="chkone"><br>
            if(checkbox == check){
                <span>Confirmed</span>
            }else{
                <span>Not Confirmed</span>
            }
        </div>
<?php
     }
?>

我想显示消息确认或未确认时，有人点击复选框而不提交页面或重新加载页面。有人能帮帮我吗?

我只是在上面的场景中添加了下面的代码，只是为了给一个想法。

if(checkbox == check){
    <span>Confirmed</span>
}else{
    <span>Not Confirmed</span>
}

首先，您需要设置一个事件侦听器来侦听更改事件并触发一个函数。

如果你给你的元素id，你可以使事情更容易地针对该元素。

您还需要将javascript放入<script>标记中。有些人把它们放在页面正文或最底部。就我个人而言，我喜欢将我的位置放在<head>标记中，因为使用window.onload只会在页面加载时尝试getElementById()。

window.onload=function(){ // Trigger when the page is ready
  //Set change event 
  document.getElementById('Confirmation').addEventListener('change', Confirm, false);
}
function Confirm(){
  var Confirmation=document.getElementById('Confirmation').checked;
  var Message;
  if(Confirmation){
    Message="Confirmed";
  }else{
    Message="Not Confirmed"
  }
  document.getElementById('Result').innerHTML=Message;
}

<input type="checkbox" id="Confirmation" />
<span id="Result">Not Confirmed</span>

如果您对上述源代码有任何疑问，请在下面留下评论，我会尽快回复您。

。checkbox DOM元素的checked属性会告诉你该元素的checked状态。

   <input id="chktype" type="checkbox" class="chkone"><br>
  if(document.getElementById('chktype').checked) {
       alert('Checked');
    } else {
        alert('Not Checked');
    }

Maybe:

$('.yourcheckbox').click(function() {
    if( $('.yourcheckbox').is(":checked") ) {
       do stuff
    } else {
       do other stuff
    }
});

您可以使用jQuery来实现。在head部分包含jQuery文件:

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <?php 
     if($params['status'] == "2"){ ?>
      <div  class="pull-right" id="confirm-ship">
      <input type="checkbox" class="chkone"><br>
      <span></span>
      </div>
    <?php  }
      ?>
      <script>
          $('.chkone').change(function(){
      if($(this).prop('checked')==true)
      {
        $('span').html('Confirmed');  
      }
      else
      {
          $('span').html('Not Confirmed');
      }
     });
    </script>

修改代码:

<div class="pull-right" id="confirm-ship">
<input type="checkbox" class="chkone" id="chkone"><br>

使用javascript:

$('.chkone').click(function(){
        if($(this).is(':checked'))
        {
            //if checked do something
        }
        else
        {
        }
    });