Как проверить значение, связанное с переключателями через JQuery? - PullRequest
Новая
       17

Как проверить значение, связанное с переключателями через JQuery?

0 голосов
/ 17 сентября 2011 
$(document).ready(function(){
    $("#esp").click(function(){ 
        $(".auth_type").slideDown("normal");
        $("#no").click(function(){
             $(".auth_other").slideUp("normal");                     
        });
        $("#yes").click(function(){
             $(".auth_other").slideDown("normal");           
        });
   });

   $("#ah").click(function(){ 
        $(".auth_type").slideUp("normal");

   });
});

На моей веб-странице есть две кнопки с идентификатором (# ах) и идентификатором (# эсп)

1. когда пользователь нажимает радиокнопку esp , тогда должна появиться строка таблицы с классом (auth_type) . В ней также есть две радиокнопки с идентификатором нет и идентификатором да

если пользователь нажимает да , то далее должна появиться строка таблицы с class (auth_other) , а если no выбран, то она должна исчезнуть

2. когда пользователь нажимает переключатель ah тогда строка таблицы с классом (auth_type) должна исчезнуть.

Все работает нормально, и теперь проблема в том, что когда пользователь выбрал нет и нажал переключатель ah, также , тогда строка таблицы с классом auth_other равна появился чего не должно быть.

Я попытался разобраться с этим и добавил следующие строки в код jquery для esp-переключатель 

var sel = $(":radio[name='auth_opt']:checked").val();   

if(sel=='n')
     $(".auth_type").slideDown("normal");

но не работал ...

Я думал, что когда пользователь нажал нет , как ах , тогда я должен заставить его принудительно появиться.

Существует ли какой-либо механизм, с помощью которого я могу принудительно устанавливать переключатели с классом "auth_type" по умолчанию на "да" кнопку всякий раз, когда пользователь нажимает " ах " или " ах " на " esp ". Я думаю, что это может решить проблему.

Я новичок в jquery, но работал с javascript, так что если кто-то может сказать мне, что-то не так с приведенным выше кодом jquery ??

Весь код HTML очень длинный, поэтому просто показывает HTML для класса "auth_type". При необходимости я добавлю код для класса "auth_other" также. 

..
....
<tr class="auth_type" style="display:none">
<td width="400" height="40">Apply Authentication</td>
<td>
  <table width="100%">
  <tr>
  <td style="text-align:center">
  <input type="radio" name="auth_opt" value="y" id="yes" align="left" checked="checked" />yes
  </td>

  <td style="text-align:center">
  <input type="radio" name="auth_opt" value="n" id="no" align="right"/>no
  </td>

  </tr>
  </table>


  </td>
  </tr>
...
...

1 Ответ

0 голосов
/ 17 сентября 2011

Вам не нужно особо беспокоиться о кнопках #yes и #no.Вам просто нужно сказать «когда нажата одна из переключателей внутри .auth_type, скрыть или показать строку .auth_other в зависимости от того, какая из двух кнопок была».Вот что делает этот код: 

$(".auth_type input:radio").click(function() {
    if ($(this).val() == "y") {
        $(".auth_other").slideDown("normal");                     
    }
    else {
        $(".auth_other").slideUp("normal");                     
    }
});

Кроме того, вы должны , а не поместить код, который прикрепляет обработчики событий click, внутри самого обработчика нажатия #esp: 

$("#esp").click(function(){ 
    $(".auth_type").slideDown("normal");

    // NOT IN HERE!
});

// OUT HERE IS CORRECT
$(".auth_type input:radio").click(function() {
    if ($(this).val() == "y") {
        $(".auth_other").slideDown("normal");                     
    }
    else {
        $(".auth_other").slideUp("normal");                     
    }
});

Из того, что вы описываете, вы также можете скрыть .auth_other, когда выбран радиоканал #ah (он может отображаться при более раннем взаимодействии с пользователем): 

$("#ah").click(function(){ 
     $(".auth_type").add(".auth_other").slideUp("normal");
});

увидеть его в действии .

...