简体   繁体   English

(php / jquery)根据另一个选中的复选框值隐藏和显示复选框

[英](php/jquery) hide and show checkboxes according to another checked checkbox value

i have a table in my database like this: 我在数据库中有一个这样的表:

------------------------------
| ID_1         | ID_2        |
------------------------------
| A            | 1           |
| A            | 2           |
| A            | 3           |
| B            | 1           |
| B            | 2           |
| B            | 5           |
| C            | 1           |
| C            | 4           |
| C            | 3           |
------------------------------

and i have some checkboxes for ID_1 like this 我有一些ID_1的复选框,像这样

<input class="ID_1" type="checkbox" value="A">
<input class="ID_1" type="checkbox" value="B">
<input class="ID_1" type="checkbox" value="C">

i'm trying to do that each time i checked the ID_1 checkbox, the ID_2 checkbox will show, depends on ID_1 checkbox i checked according to the table above. 我每次尝试选中ID_1复选框时都会尝试执行此操作,ID_2复选框将显示,具体取决于我根据上表选中的ID_1复选框。 so if i checked two checkboxes 因此,如果我选中两个复选框

<input class="ID_1" type="checkbox" value="A" checked>
<input class="ID_1" type="checkbox" value="B" checked>
<input class="ID_1" type="checkbox" value="C">

it'll show like this: 它会显示如下:

<input class="ID_2" type="checkbox" value="1">
<input class="ID_2" type="checkbox" value="2">
<input class="ID_2" type="checkbox" value="3">
<input class="ID_2" type="checkbox" value="5">

is that possible using jquery? 使用jQuery有可能吗? i need your help please 我需要你的帮助

This is possible using jquery, you need to display all the checkboxes and use class instead of Id. 使用jquery可以做到这一点,您需要显示所有复选框并使用class代替Id。 I am working on a solution will post once done. 我正在研究的解决方案将在完成后发布。

Here is working solution for you. 这是适合您的解决方案。 You can just add this in a script and run in browser. 您可以将其添加到脚本中并在浏览器中运行。

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <!DOCTYPE html > <html> <head> <script src="javas/jquery-1.12.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $('document').ready(function () { //OBJECT OF ARRAY WITH YOUR DESIRED VALUES FROM DATABASE, THIS COULD BE MADE DYNAMICALLY var id1Obj = { A:['1','2','3'], B:['1','2','5'], C:['1','3','4'] }; $('.ID_1').click(function () { $('.ID_2').hide(); jQuery('.ID_1:checked').each(function( index ) { var valId1CheckboxVal = $(this).val(); jQuery('.ID_2').each(function( index ) { if( $.inArray( $( this ).val(), id1Obj[valId1CheckboxVal] ) != -1 ) { $(this).show(); } else { // console.info("flse for " + $( this ).val()); // console.log( $(this) ); } }); }); }); }); </script> </head> <body> <div style="width:100%"> <label>ID_1 checkboxes</label><br> <input class="ID_1" type="checkbox" value="A"> A<br> <input class="ID_1" type="checkbox" value="B"> B<br> <input class="ID_1" type="checkbox" value="C"> C<br> <br> </div> <br> <div style="width:100%"> <label>ID_2 checkboxes</label><br> <input class="ID_2" type="checkbox" value="1">1 <br> <input class="ID_2" type="checkbox" value="2">2 <br> <input class="ID_2" type="checkbox" value="3">3 <br> <input class="ID_2" type="checkbox" value="4">4 <br> <input class="ID_2" type="checkbox" value="5">5 <br> </div> </body> </html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 jQuery隐藏\\显示是否选中复选框 - JQuery hide\show if checkbox is checked jQuery - 选中复选框时隐藏/显示 div - jQuery - hide / show divs when checkboxes are checked 如果选中某些复选框,则Jquery显示/隐藏div - Jquery show/hide div if certain checkboxes are checked 如果选中了2个特定的复选框,则显示一个div;如果选中了1个复选框,则显示另一个(如果选中了2个复选框,则不显示) - Show a div if 2 specific checkboxes are checked, show another if 1 checkbox is checked (don't show it if the 2 checkboxes are checked) 基于选中的复选框的jquery简单隐藏显示 - jquery simple hide show based on checkbox checked 在iCheck的复选框上显示和隐藏另一个复选框处于选中和未选中状态 - Show And Hide Another Checkbox on iCheck's checkbox checked and unchecked state jQuery仅显示选中复选框的标签并隐藏未选中的复选框 - jQuery to only show labels of checked checkboxes and hide the unchecked ones 隐藏/显示复选框,一旦选中其他复选框并设置了条件值 - hide/show checkbox once other checkbox is checked with a condition on its value jQuery如果选中了一个复选框,则根据值禁用其他特定的复选框 - jQuery if a checkbox is checked, disable other specific checkboxes based on value 复选框+ Jquery隐藏/显示 - Checkboxes + Jquery hide/show
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM