Question

<html>
<head>
<script type="text/javascript">
function removeLink(i)
{
    document.getElementById("tab2").deleteRow(i);
}
</script>


</head>
<body>
<form action="forth.php" method="post">
<table width="600" border="1" id="tab2">


<?php

    foreach($_POST as $key => $post2)
    {
    ?>
    <tr>
    <td>
    <?php
    echo $post2.'<br />';
    ?>
    <input type="hidden" name="<?php echo $key;?>" value="<?php echo $post2;?>" />

    </td>
    <td><a href="#" onClick="removeLink(this.parentNode.parentNode.rowIndex);">Remove</a></td>
    </tr>
    <?php

    }

    ?>
    <tr>
    <td><input type="submit" value="Next" /></td>
    <td>&nbsp;</td>
  </tr>
  </table>

</form>
</body>

你可以看到我的锚标签有removeLink（）的onclick函数，但它不会按预期删除整个tr。当我点击锚点生成链接时，它不会执行任何操作。在removeLink（this.parentNode.parentNode.rowIndex）中是否存在锚点不支持内部对象的问题？伙计们帮助他们如何做到这一点

Answer 1

使用Jquery。包括<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

试试这个

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.deleteMe').click(function(){
        $(this).parent().parent().remove();
        //or u can hide that like $(this).parent().parent().hide.();
    })
});

</script>


</head>
<body>
<form action="forth.php" method="post">
<table width="600" border="1" id="tab2">


<?php

    foreach($_POST as $key => $post2)
    {
    ?>
    <tr>
    <td>
    <?php
    echo $post2.'<br />';
    ?>
    <input type="hidden" name="<?php echo $key;?>" value="<?php echo $post2;?>" />

    </td>
    <td><a href="#" class="deleteMe">Remove</a></td>
    </tr>
    <?php

    }

    ?>
    <tr>
    <td><input type="submit" value="Next" /></td>
    <td>&nbsp;</td>
  </tr>
  </table>

</form>
</body>

Answer 2

首先更改锚点onclick行中的代码。

onClick="removeLink(this);">

然后尝试这个。

<script type="text/javascript">
function removeLink(obj){
var par=obj.parentNode;
while(par.nodeName.toLowerCase()!='tr'){
par=par.parentNode;
}
i = par.rowIndex;
document.getElementById("tab2").deleteRow(i);
}
</script>

删除锚不工作

2 个答案: