复选框值显示两次

时间:2012-11-20 10:35:27

标签: php javascript jquery arrays jquery-selectors

我使用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>");
}

}); });

4 个答案:

答案 0 :(得分:2)

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

使用id - 属性和$("#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>");

答案 1 :(得分: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>");
    }
});

答案 2 :(得分:1)

将您的jquery代码更改为。由于$('。check')返回对象数组,因此默认情况下只检查第一个对象的属性

$(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>');
  });
});

答案 3 :(得分:1)

尝试

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