Question

我希望在点击#catDelete时获取复选框的值。

以下是html代码

<?php $i=1; do { ?>
<input type="checkbox" value="<?php echo $row_cat['cat']; ?>" class="checkboxcat" id="<?php echo $i; ?>"  name="catcheckbox" style="border:#cccccc 1px solid; background-color:#fff;"><?php echo $row_cat['cat']; ?>
<span id="CatDelete" style="position:relative; left:10px; color:#ff0000; font-size:10px;">Delete</span>
<?php $i++; } while ($row_cat = mysql_fetch_assoc($cat)); ?>

jquery code - 它给出了第一个复选框的值

$('#CatDelete').click(function(){
alert($('.checkboxcat').attr('id'));
});

任何帮助表示赞赏。搜索是否有重复的问题，但未找到。

Answer 1

你没有表现出太多的结构，但看起来复选框是跨度之前的兄弟元素。如果是这样的话：

$("#CatDelete").click(function() {
    var val = $(this).prevAll('input').first().val();
    console.log(val);
});

从点击的元素开始，通过寻找input元素的兄弟姐妹向后工作，抓取第一个元素，并获取其值。

但是你现在已经编辑了这个问题，说这是一个循环。您不能拥有多个具有相同id（“CatDelete”）的元素。您需要更改跨度以使用类，然后更改上面的内容以使用该类。例如，如果您将其更改为使用类“CatDelete”，则：

// v--- Note the change
$(".CatDelete").click(function() {
    var val = $(this).prevAll('input').first().val();
    console.log(val);
});

Live Working Copy | Source

但是我想我可能会稍微调整一下这个结构，这样你就不会狩猎这样的兄弟元素了。如果您将每对（复选框和按钮）放在容器内，例如div，您可以更直接地找到匹配的input：

var val = $(this).closest('div').find('input').val();

E.g。

$(".CatDelete").click(function() {
    var val = $(this).closest('div').find('input').val();
    console.log("The value for the checkbox is: " + val);
});

Live Working Copy | Source

单击按钮时，获取同一类但具有不同id复选框的值

1 个答案: