Làm cách nào để nghe các thay đổi đối với giá trị được chọn của RadioGroup bằng JQuery?

Tôi cần đăng ký trình xử lý cho một nhóm nút radio. Tôi đang sử dụng JQuery và hy vọng rằng phương thức .change của nó sẽ thực hiện điều này. Tuy nhiên tôi đã không trải qua những hành vi mong muốn.Làm cách nào để nghe các thay đổi đối với giá trị được chọn của RadioGroup bằng JQuery?

Đây là đoạn trích mẫu tôi đã viết. Đáng buồn thay, "radioValueChanged" chỉ được gọi trên tải ban đầu. Việc chọn true/false không kích hoạt trình xử lý.

<html> 
<script src="jquery-1.4.2.min.js" type="text/javascript"></script> 

<form id="myForm"> 
    <div id="Question1Wrapper"> 
     <div> 
      <input type="radio" name="controlQuestion" id="valueFalse" value="0" /> 
      <label for="valueFalse"> 
       False</label> 
     </div> 
     <div> 
      <input type="radio" name="controlQuestion" id="valueTrue" value="1" /> 
      <label for="valueTrue"> 
       True</label> 
     </div> 
    </div> 
    <div id="Question2Wrapper"> 
     <div> 
      <label for="optionalTextBox"> 
       This is only visible when the above is true</label> 
      <input type="text" name="optionalTextBox" id="optionalTextBox" value="" /> 
     </div> 
    </div> 

    <script type="text/javascript"> 
     jQuery(document).ready(function() 
     { 
      $("#controlQuestion").change(radioValueChanged('controlQuestion')); 
     }) 

     function radioValueChanged(radioName) 
     { 
      radioValue = $('input[name=' + radioName + ']:checked', '#myForm').val(); 

      alert(radioValue); 

      if(radioValue == 'undefined' || radioValue == "0") 
      { 
       $('#Question2Wrapper:visible').hide(); 
      } 
      else 
      { 
       $('#Question2Wrapper:visible').show(); 
      } 
     } 
    </script> 
</form>

Nguồn

2010-11-03 Justin

Có một vài vấn đề ở đây.

Bạn sẽ ngay lập tức chạy radioValueChanged('controlQuestion') khi thực hiện kịch bản bởi vì đó là một phương pháp gọi và không phải là một nhiệm vụ chức năng.
Bộ chọn $("#controlQuestion") sai, bạn không có bất kỳ thành phần nào có id là controlQuestion.
Phương thức radioValueChanged không xử lý đúng các giá trị khi chúng được chuyển tới trình xử lý sự kiện jQuery.

Bạn có thể thử một cái gì đó như sau:

jQuery(document).ready(function() 
    { 
     $("input[name='controlQuestion']").change(radioValueChanged); 
    }) 

    function radioValueChanged() 
    { 
     radioValue = $(this).val(); 

     alert(radioValue); 

     if($(this).is(":checked") && radioValue == "0") 
     { 
      $('#Question2Wrapper').hide(); 
     } 
     else 
     { 
      $('#Question2Wrapper').show(); 
     } 
    }

Trong tất cả sự trung thực tôi không chắc chắn nếu đó là logic thực tế bạn đang tìm kiếm với câu lệnh if, nhưng hy vọng điều này sẽ cung cấp cơ sở để bạn chỉnh sửa mã hiện tại.

Nguồn

2010-11-03 20:58:09

Cảm ơn tuyệt vời. Như bạn có thể nói javascript/jquery là khá mới/gỉ. Vì vậy, '#' luôn luôn tiền tố một id không phải là một tên ... tốt để biết :) Chính xác những gì hiện "$ (this) .is (": kiểm tra ") làm gì? Tôi nghĩ rằng tôi muốn đối diện của điều đó. – Justin

@Justin Có các bộ chọn thực sự tuân thủ các quy tắc chọn CSS, bạn có thể tìm kiếm w3 cho các bộ chọn css .. hệ thống phân cấp, tên, id, v.v. Ngoài ra 'is' là một hàm jQuery: http : //docs.jquery.com/Is (mặc dù tôi không tìm thấy nó trên api.jquery.com liên quan đến tôi) –

'is()' là * chắc chắn * tại tên miền phụ api: [api.jquery.com /is/](http://api.jquery.com/is/) –

$('#Question2Wrapper:visible').show();

Đi ra : có thể nhìn thấy, điều này sẽ chỉ chọn nó nếu div đã được hiển thị, trên thực tế nó sẽ không bao giờ được hiển thị nếu nó bị ẩn.

$('#Question2Wrapper').show();

Tôi hiểu, tôi nghĩ Quintin đã đạt được hầu hết các điểm. Có một số vấn đề xảy ra ở đây.

Nguồn

2010-11-03 20:57:36

Làm cách nào để nghe các thay đổi đối với giá trị được chọn của RadioGroup bằng JQuery?

Trả lời

Các vấn đề liên quan