Question

我有以下单选按钮，

PHP代码：

<form class="small-box-footer" style="text-align:left;padding:10px;"  method="post" name="nameHere">
<?php
 $query = "SELECT * FROM subject";
 $result = mysql_query($query);
 while ($row39 = mysql_fetch_array($result)) {
    $Referrer_ID = $row39['Subject_ID'];
    $Referrer_Name = $row39['Subject_Name'];      
?>
<input type="radio" class="subject-selected" name="subject" value="<?=$Referrer_ID?>"> <?=$Referrer_Name?><?=$Referrer_ID?><br />                       
<?php } ?>                          
</form>

生成的HTML：

<input type="radio" class="subject-selected" name="subject" value="2"> GCSE Maths2<br />

<input type="radio" class="subject-selected" name="subject" value="3"> GCSE English3<br />

<input type="radio" class="subject-selected" name="subject" value="4"> GCSE Science4<br />

<input type="radio" class="subject-selected" name="subject" value="5"> GCSE Art5<br />

<input type="radio" class="subject-selected" name="subject" value="6"> GCSE Sociology6<br />

<input type="radio" class="subject-selected" name="subject" value="8"> OCR Nationals ICT8<br />

<input type="radio" class="subject-selected" name="subject" value="9"> OCR Nationals Sports9<br />

<input type="radio" class="subject-selected" name="subject" value="10"> OCR Nationals Business Studies10<br />

<input type="radio" class="subject-selected" name="subject" value="11"> Entry Science11<br />

<input type="radio" class="subject-selected" name="subject" value="12"> Functional Skills English12<br />

<input type="radio" class="subject-selected" name="subject" value="13"> Functional Skills Maths13<br />

<input type="radio" class="subject-selected" name="subject" value="14"> ESOL14<br />

<input type="radio" class="subject-selected" name="subject" value="15"> Preparation for Working Life15<br />                                                        
  </form>

以下是JavaScript

 $( ".centre-selection" ).each(function() {
          if ($('input.subject-selected').is(':checked'))
            alert($('input[name=subject]:selected').val());
            //$( this ).attr( 'href', '?module=<?=$_REQUEST['module']?>&Subject='+ $( this ).attr('data-subject')+ '&Centre_Selected_ID='+ $( this ).attr('data-centre')+ '&Class_Selected_Year='+ $( this ).attr('data-year')+ '&Class_Selected_All='+ $( this ).attr('data-all-centre')+ '&StartDate='+ $( this ).attr('report_date_start')+ '&EndDate='+ $( this ).attr('data-attendance-check-end'));
            $( this ).attr( "href", '?module=module_progress_report&Subject='+ $('input[name=subject]:selected').val()+ '&Centre_Selected_ID='+ encodeURIComponent($( this ).attr('data-centre')) + '&Class_Selected_Year='+ encodeURIComponent($( this ).attr('data-year')) + '&Class_Selected_All='+ encodeURIComponent($( this ).attr('data-all-centre')) +'&StartDate='+$('#report_date_start').val()+'&EndDate=18/12/2016');
 } );

问题：

$('input[name=subject]:selected').val()没有获取单选按钮的值。它显示结果undefined。我还尝试了method 1和method 2但结果都未定义。

更新

我更新了我的JavaScript，现在看来，

$( document ).ready(function() {  

$('.subject-selected').change(function(){
           // $("#centre-class-menu").toggle();
$("#alert").toggle();
$("#centre").toggle();
$(".range").toggle();
});

var value;
$(".subject-selected").change(function() {//changed the class to correct class selector
  if ($(this).is(':checked')) {//use $(this).is(':checked')
    console.log($(this).val());
    value = $(this).val();
    console.log(value);
  }
});


      $( ".centre-selection" ).each(function() {

            //$( this ).attr( 'href', '?module=<?=$_REQUEST['module']?>&Subject='+ $( this ).attr('data-subject')+ '&Centre_Selected_ID='+ $( this ).attr('data-centre')+ '&Class_Selected_Year='+ $( this ).attr('data-year')+ '&Class_Selected_All='+ $( this ).attr('data-all-centre')+ '&StartDate='+ $( this ).attr('report_date_start')+ '&EndDate='+ $( this ).attr('data-attendance-check-end'));
            $( this ).attr( "href", '?module=module_progress_report&Subject='+value+ '&Centre_Selected_ID='+ encodeURIComponent($( this ).attr('data-centre')) + '&Class_Selected_Year='+ encodeURIComponent($( this ).attr('data-year')) + '&Class_Selected_All='+ encodeURIComponent($( this ).attr('data-all-centre')) +'&StartDate='+$('#report_date_start').val()+'&EndDate=18/12/2016');
          } );


});

我看到控制台上没有显示任何内容，并且未定义值发送。

Answer 1

＆＃13;

$(".subject-selected").change(function() {//changed the class to correct class selector
  if ($(this).is(':checked')) {//use $(this).is(':checked')
    console.log($(this).val());
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" class="subject-selected" name="subject" value="2">GCSE Maths2
<br />

<input type="radio" class="subject-selected" name="subject" value="3">GCSE English3
<br />

<input type="radio" class="subject-selected" name="subject" value="4">GCSE Science4
<br />

<input type="radio" class="subject-selected" name="subject" value="5">GCSE Art5
<br />

<input type="radio" class="subject-selected" name="subject" value="6">GCSE Sociology6
<br />

<input type="radio" class="subject-selected" name="subject" value="8">OCR Nationals ICT8
<br />

<input type="radio" class="subject-selected" name="subject" value="9">OCR Nationals Sports9
<br />

<input type="radio" class="subject-selected" name="subject" value="10">OCR Nationals Business Studies10
<br />

<input type="radio" class="subject-selected" name="subject" value="11">Entry Science11
<br />

<input type="radio" class="subject-selected" name="subject" value="12">Functional Skills English12
<br />

<input type="radio" class="subject-selected" name="subject" value="13">Functional Skills Maths13
<br />

<input type="radio" class="subject-selected" name="subject" value="14">ESOL14
<br />

<input type="radio" class="subject-selected" name="subject" value="15">Preparation for Working Life15
<br />

＆＃13;

使用更改，在更改活动期间获取值
使用$(this).is(':checked')检查是否已选中

Answer 2

我认为你错过了引用：“或者”在你的例子中： $（'input [name =“subject”]：selected'）。val（）

https://api.jquery.com/attribute-equals-selector/

Answer 3

请试试这个

＆＃13;

$( document ).ready(function() {
$(".subject-selected").change(function() {
  if ($(this).is(':checked')) {
	alert($(this).val());
  }
});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" class="subject-selected" name="subject" value="2">GCSE Maths2
<br />

<input type="radio" class="subject-selected" name="subject" value="3">GCSE English3
<br />

<input type="radio" class="subject-selected" name="subject" value="4">GCSE Science4
<br />

<input type="radio" class="subject-selected" name="subject" value="5">GCSE Art5
<br />

<input type="radio" class="subject-selected" name="subject" value="6">GCSE Sociology6
<br />

<input type="radio" class="subject-selected" name="subject" value="8">OCR Nationals ICT8
<br />

<input type="radio" class="subject-selected" name="subject" value="9">OCR Nationals Sports9
<br />

<input type="radio" class="subject-selected" name="subject" value="10">OCR Nationals Business Studies10
<br />

<input type="radio" class="subject-selected" name="subject" value="11">Entry Science11
<br />

<input type="radio" class="subject-selected" name="subject" value="12">Functional Skills English12
<br />

<input type="radio" class="subject-selected" name="subject" value="13">Functional Skills Maths13
<br />

<input type="radio" class="subject-selected" name="subject" value="14">ESOL14
<br />

<input type="radio" class="subject-selected" name="subject" value="15">Preparation for Working Life15
<br />

＆＃13;

单选按钮值未定义

更新

3 个答案: