Question

我正在尝试创建一个简单的JQuery函数。此功能有三个复选框和一个比较按钮。示例可以是Seen here

此功能的目标是当用户点击复选框1和2时，它会比较隐藏容器1和2的内容。当用户点击复选框1和3时，它会比较隐藏容器1和3的内容。

我无法得到这个功能让这个工作。我在

下添加了一段代码

   

	$(document).ready(function() {
		 var $checkboxes = $('[name^="check"]');
		 var $target = $('#target');
		 var $button = $('.compare');

		 $button.on('click', function() {
			 $('.data').hide();
			 $('.checkBox:checked').each(function() {
				 var div = $(this).attr('name');
				 $('.compare-block').find('.'+div).show();
			 })
		})
	})

Answer 1

我改变了你的片段。您只使用长度，但如果您想要比较1和3或X和Y，您需要知道哪些被选中。

我做了改变，首先检查是否有多个要比较，然后，你看到了哪些。我编辑了一些HTML来添加一些ID

$(document).ready(function() {
  var $button  = $('.compare');

  $button.on('click', function() {
    var checkedLength = $('[name^="check"]:checked').length;
    $('#target .compare-block').hide();
    if (checkedLength > 1 ) {
      $( '[name^="check"]:checked' ).each(function() {
        //$(this).val() I use value, but you can use another thing
        $('#container'+$(this).val()).show();
      });
    }
  })
});

https://jsfiddle.net/t95kgzvx/4/

Jquery输入：选中show和hide div函数

1 个答案: