Javascript复选框控件

时间:2014-01-19 13:29:33

标签: javascript jquery html ajax checkbox

在网络上搜索但我无法找到问题的答案。我决定在这里问一个答案。我有一个使用AJAX GET提示的代码。此代码正在使用按钮。我想在这个按钮附近有一个复选框。如果未选中该复选框,我想给出一条消息。如果没有选中复选框,用户就无法继续。

以下是原始代码:

<div class="buttons">
  <div class="right">
    <a id="button-confirm" class="button"><span><?php echo $button_confirm; ?></span></a>
  </div>
</div>

<script type="text/javascript"><!--
$('#button-confirm').bind('click', function() {
    $.ajax({
        type: 'GET',
        url: 'index.php?route=payment/bank_transfer/confirm',
        success: function() {
            location = '<?php echo $continue; ?>';
        }
    });
});
//--></script>

这是我编辑的代码:

<div class="buttons">
  <div class="right">
    <input type="checkbox" value="1" /><a id="button-confirm" class="button" ><span><?php echo $button_confirm; ?></span></a>
  </div>
    </div>

<script type="text/javascript"><!--
$('#button-confirm').bind('click', function() {
  $('#button-confirm').click(function(){

  var input = $('input[type=checkbox]:checked').val();

    if ( !input ){
        alert('Lütfen checkboxı işaretleyin!');
    } else {
          }
    $.ajax({
        type: 'GET',
        url: 'index.php?route=payment/bank_transfer/confirm',
        success: function() {
            location = '<?php echo $continue; ?>';
        }
    });
});

});


//--></script>

我的代码编辑版本无效。它没有显示警报,当我单击按钮两次时按钮继续并完成该过程。

我希望显示内联警报消息,而不是弹出警报消息。

感谢您从现在开始的帮助......

1 个答案:

答案 0 :(得分:1)

  

&#34;它没有显示警告,当我点击按钮两次按钮继续并完成整个过程。&#34;

您已调用$('#button-confirm').click(...) 内的$('#button-confirm').bind('click'...)来调用$.ajax()。这意味着,第一次单击发生的唯一事情是它将第二个单击处理程序绑定到同一个元素。第二次单击它然后执行两个单击处理程序,外部绑定另一个单击处理程序,内部实际上尝试测试您的复选框并执行ajax操作。

无论复选框值如何,它继续使用ajax请求的原因是,在<{1}} }的结束else之后,您有 $('#button-confirm').click(function () { var input = $('input[type=checkbox]:checked').val(); if (!input) { alert('Lütfen checkboxı işaretleyin!'); } else { $.ajax({ type: 'GET', url: 'index.php?route=payment/bank_transfer/confirm', success: function () { location = '<?php echo $continue; ?>'; } }); } }); 来电言。

请改为尝试:

      if (!$('input[type=checkbox]').is(':checked')) {
          alert('Lütfen checkboxı işaretleyin!');

在我看来,更容易阅读的方法来测试复选框是否被选中如下:

{{1}}