2012-11-20 69 views
2

我正在使用jquery获取复选框的值。但是,发生的情况是该值正在重复,并且似乎正在获取while循环中所有复选框的值。如果有人能指出我的错误,我将不胜感激。谢谢。复选框值显示两次

更新:当前的代码。现在只选择第一个条目。进一步的复选框点击没有输出。

PHP代码

while($row = mysql_fetch_array($result)) 
{ 
    $ticket = $row['ticket_frm']; 
    $rowdate = date("d/m/Y",strtotime($row['date_frm'])); 
    $id = $row['id_frm']; 
    $from = $row['from_frm']; 
    $subject = $row['subject_frm']; 
    $message = $row['message_frm']; 

    $myString = <<<EOF 
    <span><input id="check" type="checkbox" name="delete" value="<?php echo $ticket ?>"></span> 
    <div class='msgTrue buttonMailTrue' data-message='%s' data-subject='%s' data-rowdate='%s' data-from='%s'> 

    <img src="images/sml_new_mail_icon.gif" class="mailIcon" alt="" />$subject; 
    <div class="rowdate">$rowdate</div><br /> 
    <span class="mailFrom">$from</span> 
    </div> 
    <p class="checked"></p> 
    <!-- The following end tag need to be at the start of the line --> 
    EOF; 
    printf($myString, $message, $subject, $rowdate, $from); 
} echo '<p class="checked">'.'</p>'; 

jQuery代码

$(function() { 
    $("#check").click(function() { 
     var isChecked = $(this).prop("checked"); // or $(this).prop("checked") 
     if (isChecked) { 
      $("p.checked").html("Checkbox is checked: <b>True</b>"); 
     } else { 
      $("p.checked").html("Checkbox is checked: <b>False</b>"); 
} 

}); });

回答

2

根据您的代码和选择,也有你的页面上许多input class="check"元素。
你可以通过类名找到它们,所以这就是它们重复的原因。

使用id -attribute和$("#id")语法来得到正确的价值观,或者在代码中使用this关键字:

//var isChecked = $('.check').is(':checked'); - wrong 
var isChecked = $(this).is(':checked'); // right 

更新:
你没有为你的元素提供了独特的id。因为这是行不通的。您的错误与之前相同。
试试这个代码:

<input id="check$ticket" type="checkbox" name="delete" value="<?php echo $ticket ?>"> 

同为JavaScript的 - 你必须要找到元素通过它独特的id

$("#check" + TICKET_NUMBER_HERE).click(function() { 
    var isChecked = $(this).prop("checked"); // or $(this).prop("checked") 
    if (isChecked) { 
     $("p.checked").html("Checkbox is checked: <b>True</b>"); 
    } else { 
     $("p.checked").html("Checkbox is checked: <b>False</b>"); 
+2

+1为漂亮的抓:) –

+0

@VisioN感谢错字纠正。 – VMAtm

+0

它仍然返回重复值。如果它有所作为,我正在测试ie6/7。 – user1532468

1

您应该使用this工作与当前的复选框:

$(".check").click(function() { 
    var isChecked = this.checked; // or $(this).prop("checked") 
    if (isChecked) { 
     $("p.checked").html("Checkbox is checked: <b>True</b>"); 
    } else { 
     $("p.checked").html("Checkbox is checked: <b>False</b>"); 
    } 
}); 
1

改变你的jQuery代码。作为$(“检查”)返回对象时,它是由第一个对象的默认检查属性的阵列只有

$(function() { 
    $('.check').click(function(){ 
    var isChecked = $(this).is(':checked'); 
    alert(isChecked); 
    if(isChecked) 
     $('p.checked').html('Checkbox is checked: <b>True</b>'); 
    else 
     $('p.checked').html('Checkbox is checked: <b>False</b>'); 
    }); 
}); 
1

尝试

$(".check").click(function() { 
    $("p.checked").html( 
     "Checkbox is checked: <b>" + $(this).is(":checked") + "</b>"); 
}