Question

我使用循环放置了几个复选框。以下是生成循环的PHP代码：

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

在下面的代码片段中是从此PHP代码生成的HTML以及在选中复选框时创建链接的JavaScript代码;问题是if条件没有成真：

   	  $( ".centre-selection" ).each(function() {
		$( this ).attr( "href", '?module=module_progress_report&Subject='+ $('.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');

		
	  } );

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

编辑：

我认为这个问题没有得到正确理解。下面是我写的第一个JavaScript，

$( ".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='+ $('.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');
          } );

上面的JavaScript有效，但所选主题的值始终为'2'，这是第一个主题。

Answer 1

尝试一下，

// loop only for checked checkboxes
$('.subject-selected:checked').each(function(){
    a=$(this).next('a'); // get the next anchor element
    a.length && a.attr( "href", '?module=module_progress_report&Subject='+ this.value+ '&Centre_Selected_ID='+ encodeURIComponent(a.attr('data-centre')) + '&Class_Selected_Year='+ encodeURIComponent(a.attr('data-year')) + '&Class_Selected_All='+ encodeURIComponent(a.attr('data-all-centre')) +'&StartDate='+$('#report_date_start').val()+'&EndDate=18/12/2016');
 });

根据@Fahad评论

// loop for all checkboxes
$('.subject-selected').each(function(){
    a=$(this).next('a'); // get the next anchor element
    if(this.checked){
       a.length && a.attr( "href", '?module=module_progress_report&Subject='+ this.value+ '&Centre_Selected_ID='+ encodeURIComponent(a.attr('data-centre')) + '&Class_Selected_Year='+ encodeURIComponent(a.attr('data-year')) + '&Class_Selected_All='+ encodeURIComponent(a.attr('data-all-centre')) +'&StartDate='+$('#report_date_start').val()+'&EndDate=18/12/2016');
    } else {
        // not checked code here
    }
 });

更新了锚标记循环，每次只获取2的原因是因为您使用$('.subject-selected').val()而jquery将返回第一个复选框元素。因此，您需要使用锚标记索引来获取其等效的复选框值。

$( ".centre-selection" ).each(function(index) {
     $( this ).attr( "href", '?module=module_progress_report&Subject='+ 
       $('.subject-selected:eq('+index+')').val()+ ....);
});

Answer 2

你必须像这样遍历所有1 + true：

Answer 3

＆＃13;

$(".subject-selected").change(function() {
    if(this.checked) {
        //Do stuff
    }
});

＆＃13;

尝试这样的事情

Answer 4

您需要为每个“输入”添加一个事件监听器来捕获事件（单击或更改或其他）。

尝试：

$('.subject-selected').each(function(){
  $(this).on('click',function(e){
    if ( $(this).is(':checked') ){
    $(this).attr("href", '?module=module_progress_report&Subject=' + $("input[type='checkbox']").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');
    }
  });
});

（$（'。class-name'）。is（“：checked”））Never True

4 个答案: