Giá trị thay đổi JQuery từ nút radio

Question

Tôi có một biến được gọi là category phải thay đổi giá trị của nó theo nút radio đã chọn. Vấn đề là tôi không nhận được điều đó khi nhấp vào nút radio hoặc nút khác, giá trị sẽ thay đổi ngay lập tức.

Đây là mã tôi có:

<form> 
<input type="radio" name="category" value="doctor" /> Doctor 
<input type="radio" name="category" value="police" checked /> Policia 
</form> 

var category = $('[name="category"]:checked').val(); 

tôi cần bạn tự động thay đổi giá trị của biến category khi bạn nhấp vào nút radio.

Answer 1

Bạn cần thay đổi giá trị của mục mỗi khi người dùng thay đổi các nút radio được chọn. Vì vậy, bạn sẽ cần một sự kiện để kích hoạt khi người dùng nhấp vào một đài phát thanh. Bạn có thể kiểm tra FIDDLE

var category = null; 
$("input[name='category']").click(function() { 
    category = this.value; 
}); 

Answer 2

tôi nghĩ rằng bạn cần chỉ đơn giản là một cái gì đó như thế này:

var category; 

    $('radio[name="category"]').click(function(){ 
     category=this.value; 
    }); 

Answer 3

Thay vì sử dụng category biến sử dụng $('[name="category"]:checked').val() bất cứ nơi nào bạn muốn giá trị của nút radio kiểm tra. Nếu không, bạn có thể sử dụng sự kiện change hoặc click để đặt giá trị nút radio checked thành category biến.

Answer 4

Đính kèm một event handler cho sự kiện change:

$(':radio[name="category"]').change(function() { 
    var category = $(this).filter(':checked').val(); 
}); 

Answer 5

sử dụng các .change() để nắm bắt sự kiện thay đổi cho một nút radio.

Answer 6

var category; 
    $(':radio[name="category"]').change(function() { 
     category=this.value; 
    }); 

Và đây là bản trình bày jsfiddle.net.

Answer 7

Bạn không nên cung cấp cho cùng một ID cho nhiều hơn một phần tử, bạn nên sử dụng lớp thay vì như thế này:

<form> 
    Option 1<input type="radio" name="opt" class="radio" value="Option 1"> 
    Option 2<input type="radio" name="opt" class="radio" value="Option 2"> 
</form> 

thay vì:

<form> 
    Option 1<input type="radio" name="opt" id="radio" value="Option 1"> 
    Option 2<input type="radio" name="opt" id="radio" value="Option 2"> 
</form> 

và mã của bạn vẫn như nhau và nó sẽ hoạt động tốt :)