2012-08-31 43 views
10

Tôi đang làm việc với biểu mẫu có nút radio là một phần của bộ radio và chỉ một nút có thể được chọn cùng một lúc (không có vấn đề với lựa chọn duy nhất). Một trong những radio đó phải kích hoạt mã mỗi khi nó được chọn một mã khác khi nó không được chọn (một radio khác được chọn), im sử dụng phương thức .change và nó kích hoạt mã khi bạn nhấp vào nó, nhưng không phải khi nó thua vùng chọn. Những gì tôi muốn là để chuyển đổi hoặc có thể biết khi nào nó bị mất lựa chọn.Nhóm jQuery của các nút radio. Phương thức thay đổi

Tôi có thể làm điều đó thêm mã vào các phương thức khác .change nhưng có nhiều bộ radio và sẽ rất đau, tôi đang tìm cấu hình một lần.

Sửa

Các đánh dấu được làm bằng động cơ ASP MVC Razor như thế này:

@Html.RadioButtonFor(x => x.SomeModel, new { @class = "special-radio" }) 
@* Other radios but without the 'specia-radio' class *@ 

js:

// logging 
$(function(){ 
    $('.special-radio').change(function(){ 
    console.log('change'); 
    }); 
}); 

Sự thay đổi chuỗi chỉ xuất hiện khi bạn nhấp vào 'đặc biệt radio của đài phát thanh.

+1

Chia sẻ một số mã. – Gabe

Trả lời

4

Bạn có thể làm điều này bằng cách sử dụng sự kiện thay đổi trên nhóm phát thanh theo cách này,

kiểm tra câu hỏi này,

Monitoring when a radio button is unchecked

+0

phương pháp thay đổi không hoạt động với anh ta vì anh ấy/cô ấy đang đăng ký trên một nút radio thay vì nhóm. –

3

Không có sự kiện kích hoạt khi một đài phát thanh là không được kiểm soát, bởi vì nó sẽ là dư thừa. Hãy thử điều này thay vì:

http://jsfiddle.net/hmartiro/g4YqD/1/

Nó đặt một sự kiện thay đổi trên bộ radio và chỉ bắn một sự kiện nếu radio được chọn là đặc biệt và sự kiện khác khác.

+0

Nó không hoàn toàn phù hợp với vấn đề của tôi bởi vì tôi có nhiều nhóm radio, nhưng đó là một điểm khởi đầu tốt. – loki

+0

Bạn có thể sử dụng '$ ('input [name = foo]')' nếu bạn muốn tách ra một bộ. –

2

Nếu không thể thêm lớp học vào. Bạn có thể sử dụng vùng chứa có số nhận dạng cho các nút radio này. Bằng cách này bạn có thể cô lập sự kiện thay đổi. DEMO FIDDLE

var prev_data; 
$('#special_radios input').change(function(){ 
    var me = $(this); 
    //running function for check 
    $('#log').html('<p>firing event for check: '+ me.attr('id') +'</p>'); 
    if(prev_data) 
     uncheck_method(prev_data); 
    prev_data = me; 
}); 

//@param obj = jquery raidio object 
function uncheck_method(obj){ 
    $('#log').append('<p>firing event for uncheck: '+obj.attr('id')+'</p>'); 
    obj.prop('checked', false) 
    //console.log($('#special_radios input:checked')); 
} 

​ 

html

<input type="radio" name="zz" id="5"/> 
<div id="special_radios"> 
    <input type="radio" name="rx" id="1"/> 
    <input type="radio" name="ry" id="2" /> 
    <input type="radio" name="rz" id="3"/> 
    <input type="radio" name="ra" id="4"/> 
</div> 
<div id="log"></div> 
​ 
Các vấn đề liên quan