после выбора 2х input:radio отображать кнопку
Подскажите как отображать кнопку, при условии что выбрано значение в первой группе input:radio и во второй группе input:radio
вот как мне это объединить? var $a = $('input[id^=type_]'); var $b = $('input[id^=deliv_]'); var $show_a = '0'; var $show_b = '0'; $a.change(function(){ $show_a = '1'; }) $b.change(function(){ $show_b = '1'; }) чтобы я мог воспользоватся примерно такой конструкцией: if($show_a.length && $show_b.length){ $('#orderbut').show(); } или как сделать правильно? |
piraids,
:write: <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> #orderbut{ display: none; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script> $(function () { var $a = $('input[id^=type_]'), $b = $('input[id^=deliv_]'), show = function(){ if($a.is(":checked") && $b.is(":checked")){ $('#orderbut').show()}} ; $a.change(show) $b.change(show) }) </script> </head> <body> <input id="type_1" name="one" type="radio"> <input id="type_2" name="one" type="radio"> <input id="type_3" name="one" type="radio"> <br> <input id="deliv_1" name="two" type="radio"> <input id="deliv_2" name="two" type="radio"> <input id="deliv_3" name="two" type="radio"> <div id="orderbut"> ok </div> </body> </html> |
рони,
спасибо большое!! буду знать) |
<style type="text/css"> #orderbut { display: none; } input[name="one"]:checked ~ input[name="two"]:checked ~ #orderbut { display: block; } </style> <input id="type_1" name="one" type="radio"> <input id="type_2" name="one" type="radio"> <input id="type_3" name="one" type="radio"> <br> <input id="deliv_1" name="two" type="radio"> <input id="deliv_2" name="two" type="radio"> <input id="deliv_3" name="two" type="radio"> <div id="orderbut"> ok </div> |
рони,
а если у меня еще появляется блок тоже с input radio в зависимости от уровня доступа, как включить его в проверку? Если я сделаю вот так, как я написал ниже - это будет правильно? или есть какой то более легкий вариант? <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> #orderbut{ display: none; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script> $(function () { var $a = $('input[id^=type_]'), $b = $('input[id^=deliv_]'), $c = $('input[id^=info_]'); if($c.length){ var show = function(){ if($a.is(":checked") && $b.is(":checked") && $c.is(":checked")){ $('#orderbut').show()}} ; $a.change(show); $b.change(show); $c.change(show); }else{ var show = function(){ if($a.is(":checked") && $b.is(":checked")){ $('#orderbut').show()}} ; $a.change(show); $b.change(show); } }) </script> </head> <body> <input id="type_1" name="one" type="radio"> <input id="type_2" name="one" type="radio"> <input id="type_3" name="one" type="radio"> <br> <input id="deliv_1" name="two" type="radio"> <input id="deliv_2" name="two" type="radio"> <input id="deliv_3" name="two" type="radio"> <br> <input id="info_1" name="three" type="radio"> <input id="info_2" name="three" type="radio"> <input id="info_3" name="three" type="radio"> <div id="orderbut"> ok </div> </body> </html> |
piraids,
в 29 строке ничего не пропустили? |
рони,
да, поправил) |
piraids,
:write: вариант ... в массиве можно указать любое количество селекторов зависимых input -- будут задействованы только существующие; <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> #orderbut{ display: none; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script> $(function () { var arr = ['input[id^=type_]','input[id^=deliv_]','input[id^=info_]']; (function (c) { var show = function () { for (var a = 0; a < c.length; a++) { var b = $(c[a]); if (b.length && !b.is(":checked") ) return false } $("#orderbut").show() }; $.each(c, function (a, b) { $(b).change(show) }) })(arr); }) </script> </head> <body> <input id="type_1" name="one" type="radio"> <input id="type_2" name="one" type="radio"> <input id="type_3" name="one" type="radio"> <br> <input id="deliv_1" name="two" type="radio"> <input id="deliv_2" name="two" type="radio"> <input id="deliv_3" name="two" type="radio"> <br> <input id="info_1" name="three" type="radio"> <input id="info_2" name="three" type="radio"> <input id="info_3" name="three" type="radio"> <div id="orderbut"> ok </div> </body> </html> |
Часовой пояс GMT +3, время: 13:47. |