$('input[type=checkbox]').change(function()

$('input[type=checkbox]').change(function()

本文关键字：change function checkbox input type      更新时间：2023-09-26

目前我有以下脚本，该脚本检查复选框值是否已更改，但当我尝试使用它时它不起作用！

<script>
    $('input[type=checkbox]').change(function () {
        if ($(this).is(':checked')) {
            if ($(this).prev().attr('checked') && $(this).val() != $(this).prev().val()) {
                alert("previous checkbox has same value");
            }
        }
    });​
 </script>
 <input name="" type="checkbox" value="here"/>(if this was checked)
 <input name="" type="checkbox" value="here"/>(then this)
 <input name="" type="checkbox" value="there"/>(would not allow prompt alert) 
 <input name="" type="checkbox" value="here"/>(would allow)​

您可以看到它在这里工作，但是当我尝试使用它时它不起作用http://jsfiddle.net/rajaadil/LgxPn/7

这个想法是在选中的复选框值

与之前选中的复选框值不同时发出警报！

目前我的复选框看起来像

<input type="checkbox" name="checkbox[]" onClick="getVal();setChecks(this)" value="`key`=<?php echo $rspatient['key']?>" class="chk" id="chk<?php echo $a++?>"/>

我以为('input[type=checkbox]').change(function()的功能会得到这些，但我在某处出错了？

要选中上一个选中的同级复选框，请使用以下命令：

$(this).prevAll(":checked:first")

我希望使用:last，但:first是有效的。 这对我来说是违反直觉的，并且与:first和:last通常的工作方式不一致，但我在几个浏览器中对其进行了测试，结果是一致的。

$(':checkbox').change(function() {
    if (this.checked) {
        var lastChecked = $(this).prevAll(":checked:first");
        if (this.value == lastChecked.val()) {
            alert("previous checked box has same value");
        }
    }
});

演示：http://jsfiddle.net/LgxPn/15/

编辑：如果"以前选中的复选框"是指用户单击的最后一个框，那么您需要自己跟踪它。 没有内置的jQuery方法可以告诉你任何关于点击历史的信息。

当用户首先选中多个框，然后选中并立即取消选中一个框时，会发生什么情况？ 是否应使用下一个最近的复选框？ 如果是这样，那么您需要跟踪所有复选框以及单击它们的顺序。 以下是跟踪复选框的方法：

var lastChecked = [];
$(':checkbox').change(function() {
    if (this.checked) {
        if (lastChecked.length && this.value == lastChecked[0].value) {
            alert("the last box you checked has the same value");
        }
        lastChecked.unshift(this);
    }
    else {
        lastChecked.splice(lastChecked.indexOf(this), 1);
    }
});​

演示：http://jsfiddle.net/LgxPn/21/

只是一个猜测（使用一些更好的语法），试试这个：

<script type="text/javascript">
$(function() {
  $('input:checkbox').change(function() {
    if($(this).is(':checked'))
    {
       if ($(this).prev().prop('checked') && $(this).val() != $(this).prev().val()) { 
         alert("previous checkbox has same value");
       }
    }
  });​
});
</script>

您的警报消息和if语句不匹配。检查值是否!=，但警报显示它们相等。我假设警报是您要检查的情况。尝试：

$(':checkbox').change(function() {
  var $this = $(this);
  var $prev = $this.prev();
  if($this.is(':checked')) {
    if($prev.is(':checked') && $this.val() === $prev.val()) {
      alert('Previous checkbox has same value');
    }
  }
});​

正如其他人提到的，确保这一切都在一个$(document).ready()块内

这似乎在 Chrome 中对我有用：

$(function() {
    $('input[type=checkbox]').click(function() {
        if ($(this).is(':checked')) {
            if ($(this).prev().prop('checked')) {
                if ($(this).val() != $(this).prev('input[type=checkbox]').val()) {
                    alert("previous checkbox has same value");
                }
            }
        }
    });
});​

下面是一个 JSFiddle：http://jsfiddle.net/gy8EQ/

相关文章：