如何使用javascript将选中的复选框值传递到下一页

我正在从数据库中检索值，并将其显示在带有复选框的html表中。我还有一个按钮，当用户选中该复选框时，它会传递rowid并重定向下一页。如果用户不选中该复选框并选中该按钮，它将不会传递rowid，也不会重定向

我的问题是，当选中html表中的第一行并按下按钮时，它会工作，但如果我选中html表中的第二行并单击按钮，它不会执行任何操作

下面是我的代码

<tbody id="fbody" class="fbody" style="width:1452px" >    
<?php    

$clientid=$_GET['clientid'];  
if($clientid!=""){      
    $sql = mysql_query("SELECT * FROM billingdatainputandexport WHERE clientid =            '$clientid'");    

    while($rows=mysql_fetch_array($sql))
    {
        if($alt == 1)
        {
            echo '<tr class="alt">';
            $alt = 0;
        }
        else
        {
            echo '<tr>';
            $alt = 1;
        }

    echo '<td  style="width:118px" class="edit clientid '.$rows["id"].'">'.$rows["clientid"].'</td>
        <td id="CPH_GridView1_clientname" style="width:164px" class="edit clientname '.$rows["id"].'">'.$rows["clientname"].'</td>      
        <td id="CPH_GridView1_billingyear" style="width:168px" class="edit  billingyear '.$rows["id"].'">'.$rows["billingyear"].'</td>
        <td id="CPH_GridView1_billingmonth " style="width:169px" class="edit billingmonth '.$rows["id"].'">'.$rows["billingmonth"].'</td>
        <td style="width:167px" class=" '.$rows["id"].'">
        <input name="nochk" value=" '.$rows["id"].'" type="submit" style="margin:0 0 0 49px;background-image: url(/image/export.png);background-repeat: no-repeat;cursor:pointer;color:#C0C0C0;" ></td>
        <td style="width:69px"><input type="checkbox" id="chk1" name="chk1" value=" '.$rows["id"].'"/></td>                                 
        </tr>';   

    }
}
?>    
</tbody>

<input type="image" name="yousendit" id="yousendit" src="/image/export.png"  style="margin:-5px 23px -28px 822px;cursor:pointer;" >

您可以更改此设置：

id="chk1"
name="chk1"

<input type="checkbox" id="chk1" name="chk1" value=" '.$rows["id"].'"/>

id=“chk1”
name=“chk1”

为此：

class="chk"
name="chk"'.$rows["id"].'

'<input type="checkbox" id="chk1" name="chk"'.$rows["id"].'" value=" '.$rows["id"].'"/>'

class=“chk”
name=“chk”.$rows[“id”]。'
“HTML页面应该只有1个指定ID的元素，因为代码在循环中运行，而您正在分配ID


所有复选框都将具有相同的ID。现在，一旦您尝试通过选择器获取选中状态

if（document.getElementById（'chk1'）.checked）{

如果仅选中第一个复选框并忽略所有其他实例，则返回true

您应该使用类选择器和循环元素来获取逗号分隔的值并进行ajax调用

在HTML中将id首次更改为类

并将JavaScript更改为处理选中的复选框数组

$(document).ready(function () {

$("#yousendit").click(function () {

    var id_list = [];

    $.each($(".chk1:checked"), function (index, element) {
        var tmpVal = $(element).val();
        id_list.push(tmpVal);
    });


    if (id_list.length > 0) {


        var ms = id_list.join();




        $.ajax({
            type: "post",

            data: "ms=" + ms,
            success: function (data) {

                window.location = 'billingdatainputandexport/billingdatainputandexportdetailedreport.php?ms=' + ms + ''

                $.post("billingdatainputandexport/billingdatainputandexportdetailedreport.php", {
                    "test": ms
                });
                $("#result").html(data);

            }
        });

    }
});

});

因为存在多次相同的ID，如果出现这种情况，浏览器将只查找第一个ID。为什么要使用
document.getElementById（'chk1'）。
当您可以使用jquery
$（'chk1'））.
相反？我同意Jai的观点：多次使用相同的id也是一个主要问题problem@iTroubs您可以将id更改为类名，并在使用jQuery
$（'.chk:checked'）时创建如下选择器
谢谢，但如果用户未选中复选框并选中按钮，我只想传递一个复选框值。它不会传递rowid，也不会重定向。上面的注释对我来说很难解释。好的，现在您将复选框值作为数组传递，但我只想传递一个复选框值，现在它正在工作，但它也在传递取消勾选的复选框值嗯，现在很清楚了，只需将
$每个（$（“.chk1”）
更改为
$。每个（$（“.chk1:选中”）
，干杯。
$("#yousendit").click(function() {
    var $check = $('.chk:checked');

    $.ajax({  //<-------------here you havn't mentioned the url
       type:"post",
       data:$check.serialize(),
       success:function(data){

           ............

       }
    });
});

$(document).ready(function () {

$("#yousendit").click(function () {

    var id_list = [];

    $.each($(".chk1:checked"), function (index, element) {
        var tmpVal = $(element).val();
        id_list.push(tmpVal);
    });


    if (id_list.length > 0) {


        var ms = id_list.join();




        $.ajax({
            type: "post",

            data: "ms=" + ms,
            success: function (data) {

                window.location = 'billingdatainputandexport/billingdatainputandexportdetailedreport.php?ms=' + ms + ''

                $.post("billingdatainputandexport/billingdatainputandexportdetailedreport.php", {
                    "test": ms
                });
                $("#result").html(data);

            }
        });

    }
});

});