оказать скрытые элементы с определенным классом
Всем привет
радиокнопкой с id r1 показываются скрытые элементы с классом field
if ($('[id="r1"]:checked').val()) {
$(".field").slideDown(500);
}
как можно перечислить id радиокнопок, по которым будут показываться скрытые элементы с классом field так не получается
if ($('[id="r1", id="r2"]:checked').val()) {
|
rodiony4,
может html сделать для примера? |
рони,
<input type="radio" name="name_of_button" value=1 id="r1">скрываем div1, div2, div3<br> <input type="radio" name="name_of_button" value=2 id="r2">скрываем div1, div2<br> <input type="radio" name="name_of_button" value=3 id="r3"><br> <input type="radio" name="name_of_button" value=4 id="r4"><br> <div id="div1" class="field">div1</div> <div id="div2" class="field">div2</div> <div id="div3" class="field">div3</div> <div id="div4" class="field">div4</div> <div id="div5" class="field">div5</div>
<script type="text/javascript">
$("input").click(function(){
if ($('input[id="r1"]:checked').val()) {
$("#div1, #div2, #div3").slideUp(500);
}
if ($('input[id="r2"]:checked').val()) {
$("#div1, #div2").slideUp(500);
$("#div3").slideDown(500);
}
if ($('input[id="r3, id="r4"]:checked').val()) {// ?????
$(".field").slideDown(500);
}
});
</script>
|
Открывашка 232
rodiony4,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
var s = $('[name="name_of_button"]');
s.click(function() {
$(".field").not($({r1 : "#div1, #div2, #div3", r2 : "#div1, #div2"}[this.id]).slideUp(500)).slideDown(500);
});
});
</script>
</head>
<body>
<input type="radio" name="name_of_button" value=1 id="r1">скрываем div1, div2, div3<br>
<input type="radio" name="name_of_button" value=2 id="r2">скрываем div1, div2<br>
<input type="radio" name="name_of_button" value=3 id="r3"><br>
<input type="radio" name="name_of_button" value=4 id="r4"><br>
<div id="div1" class="field">div1</div>
<div id="div2" class="field">div2</div>
<div id="div3" class="field">div3</div>
<div id="div4" class="field">div4</div>
<div id="div5" class="field">div5</div>
</body>
</html>
|
рони, спасибо, работает, но первый раз по клику (r1 или r2) дивы скрываются, а после второго раза - сначала открываются все дивы, а потом уже скрываются нужные
|
rodiony4,
изменил смотрите снова |
рони, да, теперь все супер, спасибо!
Но еще одна проблема - на сайте дивы начинают скрываться только со второго раза (нажал одну радиокнопку - дивы не скрываются, нажал другую радиокнопку - дивы скрылись, далее все стабильно) дело в том, что ваш код размещен в другой функции, вот как все выглядит на сайте:
function changeTextOnePage3(op_textinclship, op_currency, op_ordertotal)
{
op_hidePayments();
changeTextOnePage(op_textinclship, op_currency, op_ordertotal);
var jQnoC6 = jQuery.noConflict();
var s = jQnoC6('[name="shipping_rate_id"]');
s.click(function() {
jQnoC6(".formField, .formLabel").not(jQnoC6({hashd5561dda4545a69195256a8ee62fcc91 : "#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK", hasha917f3643fcc7141bc83f55fb83a6c62 : "#vm_pasport_div, #vm_pasport_input, #infoTK"}[this.id]).slideUp(500)).slideDown(500);
});
}
скорей всего мешает функция
s.click(function() {
заменял ее на
jQnoC6("input").click(function(){
но все равно - дивы начинают скрываться со второго раза могу дать ссылку на страницу сайта |
rodiony4,
а какой смысл ставить код в функцию changeTextOnePage3 ? пока не сработает эта функция кликать бесполезно если функция срабатывает несколько раз -- она просто убивает код -- каждый второй раз. |
rodiony4,
заменить в коде выше 4 пост все $ на jQuery и добавить свои идентификаторы и ставьте в любое место. |
Цитата:
Цитата:
код, который я привел в начале темы, в этой функции работает
function changeTextOnePage3(op_textinclship, op_currency, op_ordertotal)
{
op_hidePayments();
changeTextOnePage(op_textinclship, op_currency, op_ordertotal);
var jQnoC6 = jQuery.noConflict();
if (jQnoC6("input:checked").val() == "1") {
jQnoC6("#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK").slideUp(500);
}
if (jQnoC6("input:checked").val() == "2") {
jQnoC6("#vm_pasport_div, #vm_pasport_input, #infoTK").slideUp(500);
jQnoC6("#vm_myadres_div, #vm_myadres_input").slideDown(500);
}
if (jQnoC6("input:checked").val() == "3") {
jQnoC6(".formField, .formLabel").slideDown(500);
}
}
если его обернуть функцией - не работает
$("input").click(function(){
......
});
но ваш код проще и короче, может можно его подшаманить, чтобы он корректно работал? Например, как то обойтись без click(function() { |
rodiony4,
решение выше или вы неправильно сформулировали начальные данные и макет |
рони, код вставлял до и после changeTextOnePage3, без результата
jQuery(function(){
var s = jQuery('[name="shipping_rate_id"]');
s.click(function() {
jQuery(".field").not(jQuery({hashd5561dda4545a69195256a8ee62fcc91 : "#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK", hasha917f3643fcc7141bc83f55fb83a6c62 : "#vm_pasport_div, #vm_pasport_input, #infoTK"}[this.id]).slideUp(500)).slideDown(500);
});
});
|
rodiony4,
консоль что пишет и есть ли эти элементы уже на странице? |
рони, консоль ошибок не выдает, элементы на странице
|
rodiony4,
вариант для : если элементов нет на странице
jQuery(function() {
jQuery('body').on('click', '[name="shipping_rate_id"]', function(event) {
jQuery(".field").not(jQuery({
hashd5561dda4545a69195256a8ee62fcc91: "#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK",
hasha917f3643fcc7141bc83f55fb83a6c62: "#vm_pasport_div, #vm_pasport_input, #infoTK"
}[this.id]).slideUp(500)).slideDown(500);
});
});
|
Цитата:
сейчас код выглядит так
function changeTextOnePage3(op_textinclship, op_currency, op_ordertotal)
{
op_hidePayments();
changeTextOnePage(op_textinclship, op_currency, op_ordertotal);
var jQnoC6 = jQuery.noConflict();
var s = jQnoC6('[name="shipping_rate_id"]');
s.click(function() {
jQnoC6(".formField, .formLabel").not(jQnoC6({hashd5561dda4545a69195256a8ee62fcc91 : "#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK", hasha917f3643fcc7141bc83f55fb83a6c62 : "#vm_pasport_div, #vm_pasport_input, #infoTK"}[this.id]).slideUp(400)).slideDown(400);
});
}
вот ссылка http://www.glassbus.ru/test/vm.html?page=shop.product_details&flypage=flypage. tpl&product_id=2&category_id=1 нажмите Купить, перейдете в оформление заказа, жмакаем на "Самовывоз" - поля "Адрес получателя" и "Серия и номер паспорта" не скрылись жмакаем еще раз на "Самовывоз" - поля скрылись, и далее все стабильно |
Цитата:
|
рони, попробую что ни будь сделать сам или оставлю старый код. Вам большое спасибо!
|
рони, дело в том, что элементы на страницу подгружаются динамически аяксом.
Сделал так, и теперь ваш js выполняется:
<script type="text/javascript">
var jQnoC6 = jQuery.noConflict();
var s = jQnoC6('[name="shipping_rate_id"]');
s.live("click", function(){
jQnoC6(".formField, .formLabel, #infoTK").not(jQnoC6({
hashd5561dda4545a69195256a8ee62fcc91 : "#vm_myadres_div, #vm_myadres_input, #vm_pasport_div, #vm_pasport_input, #infoTK",
hasha917f3643fcc7141bc83f55fb83a6c62 : "#vm_pasport_div, #vm_pasport_input, #infoTK"
}[this.id]).slideUp(300)).slideDown(300);
});
</script>
|
Цитата:
|
| Часовой пояс GMT +3, время: 21:38. |