JQuery:在单击删除按钮时更改元素值

时间:2014-06-16 23:13:39

标签: jquery

我想在选中复选框并单击删除按钮时更改元素(modeflag)value ='D'。在下面的代码中,如果我选中一个复选框,则该值正常。但是当选中多个复选框时不起作用。它总是将第一个元素值更改为“D”。我不知道JQuery。请帮忙解决这个问题。

<html>
<head>
<script src='jquery-1.8.3.min.js'></script>
<script type="text/javascript"> 
$(function() {
$("#del").on('click', delrow);
});
function delrow() {
    var checks = $( "input[type=checkbox]:checked" );    
    var chkval = $( "input[type=checkbox]:checked" ).val();
    checks.parent().parent().hide();
    if(chkval>0){ $("#md"+chkval).attr('value','D'); }
    }
</script>

</head>
<body>
<form action="rowhide_action.php" method="post" name="save_form">

<input type="button" id="del" value="Delete"></input>


<table border="1">
<thead>
<tr>
<th>#</th>
<th>Databases</th>
</tr>
</thead>

<tbody id="db_grid">

<tr id="db_grid_row1">
<td><input type="checkbox" name="cbox[]" value="1" ></input></td>
<td><input type="text" name="db[]" value="Oracle"></input></td>
<td><input type="hidden" name="modeflag[]" value="S" id="md1" ></input></td>
</tr>

<tr id="db_grid_row2">
<td><input type="checkbox" name="cbox[]" value="2"></td>
<td><input type="text" name="db[]" value="MySQL"></input></td>
<td><input type="hidden" name="modeflag[]" value="S" id="md2"></input></td>
</tr>

<tr id="db_grid_row3">
<td><input type="checkbox" name="cbox[]" value="3"></td>
<td><input type="text" name="db[]" value="Cassandra"></input></td>
<td><input type="hidden" name="modeflag[]" value="S" id="md3"></input></td>
</tr>

<tr id="db_grid_row4">
<td><input type="checkbox" name="cbox[]" value="4"></td>
<td><input type="text" name="db[]" value="Mongo"> </input></td>
<td><input type="hidden" name="modeflag[]" value="S" id="md4"></input></td>
</tr>

</tbody>
</table>
</br>
<input type="submit" value="Save"></input></br></br>
</form>
</body>
</html>

post action的rowhide_action.php页面代码如下所示。

<?php

 @extract($_POST); 

 echo "<pre>";
 print_r($_POST);
 echo "</pre>";

?>

提前感谢您的帮助和感谢。

1 个答案:

答案 0 :(得分:0)

那是因为你只存储了第一个匹配元素的值,试试这个:

function delrow() {
     var checkedNo= $( "input[type=checkbox]:checked" ).length;
     var checks = [];
     var chkval = [];
     for(i=0;i<=checkedNo;i++){
         checks[i] = $( "input[type=checkbox]:checked" ).eq(i);
         chkval[i] = $( "input[type=checkbox]:checked" ).eq(i).val();
         checks[i].parent().parent().hide();
         if(chkval[i]>0){ $("#md"+chkval[i]).attr('value','D'); }
     }
    }

但比这更容易:

function delrow() {
    $( "input[type=checkbox]:checked" ).each(function(){
        $(this).parent().parent().hide();
        if($(this).val()>0){ $("#md"+$(this).val()).attr('value','D'); }
    });
    }