0

我有这个 html，它是 php 的输出。

...
...
<tr valign='top'>
<td>1</td>
<td class="parent">
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/1">Main menu
</a></td>
<td align='center'>active</td>
<td align='center'>0</td>
<td class="parent" >0</td>
<td align='center'></td>
<td align='center'>
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/1">edit
</a> | <a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1" class="delete_link" id="delete_link_1">delete
</a></td>

</tr>
<tr valign='top'>
<td>68</td>
<td class="child">
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/68">Forsiden
</a></td>
<td align='center'>active</td>
<td align='center'>1</td>
<td class="child" >0</td>
<td align='center'>forsiden</td>
<td align='center'>
<a href="http://127.0.0.1/ci/index.php/admin/menus/edit/68">edit</a> | 
<a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/68" class="delete_link" id="delete_link_68">delete
</a></td>

</tr>
...
...

当您单击删除链接时，我想删除、隐藏和向上滑动 tr 之一。我创建了以下 jquery。它会删除 DB 中的数据，但不会向上滑动并隐藏已删除的行。

谁能告诉我我在做什么错误和正确的代码。

$('.delete_link').live('click', function(eve){
eve.preventDefault();
if(confirm('Are you sure you want to delete this page?'))
var id = this.href.match(/[^\/]*$/);
this.id = 'http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/' + id;

$.post(this.id, function(){

$('#delete_link_'+id)
        .closest('tr')
        .slideUp('slow',function(){
         $(this).remove();
              });
});
});
4

4 回答 4

2

首先你的问题实际上是什么

  • 您缺少 if 语句上的大括号，因此 ajax-request 每次都会触发，但由于构造的 url 无效，因此在后台静默失败。

  • 您正在更改iddelete_link。

最好用一个例子来说明。假设这个链接被点击

<a href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1"
   class="delete_link" id="delete_link_1">
    delete
</a>

$('.delete_link').live('click', function(eve){
1)    eve.preventDefault();
2)    if(confirm('Are you sure you want to delete this page?'))
3)        var id = this.href.match(/[^\/]*$/);
4)    this.id = 'http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/' + id;
5)    $.post(this.id, function(){
6)        $('#delete_link_'+id).closest('tr').slideUp('slow', function() {
7)            $(this).remove();
          });
      });
});

X）this点击处理程序内部是<a>我们点击它的标签：

  • id="delete_link_1"
  • href="http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1"

第 3 行）var id设置为1

第 4 行）this.id设置为http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1 （！！）

嗯，一会儿 this是属性id设置为 的 a-tag delete_link_1。现在你覆盖 id

第 5 行）您使用正确的 url 启动 ajax-post

第 6 行）'#delete_link_'+id计算结果为#delete_link_http://127.0.0.1/ci/index.php/admin/menus/deleteMenu/1。当然，没有元素具有这样的 id，因此其余的（查找父 tr、动画、删除）失败，但实际删除成功。

建议的解决方案

顺便提一句。无论如何，我不明白整个正则表达式的用途，因为您构造的 post-url 看起来与href已经在<a .. class="delete_link">...</a>

所以我建议你改用这段代码

$('.delete_link').live('click', function(eve) {
    eve.preventDefault();
    if(confirm('Are you sure you want to delete this page?')) {
        $.post(this.href, function() {
            $(this).parents('tr').eq(0).slideUp('slow', function() {
                $(this).remove(); //is correct as "this" refers to the selected tr
            });
        });
    }
});
于 2009-12-15T01:21:02.060 回答
1

试试这个：

$('.delete_link').live('click', function(eve){
    eve.preventDefault();
    if(confirm('Are you sure you want to delete this subscriber?')){
        var row = $(this).closest('tr');
        $.post(this.href, function(){
            row.slideUp('slow',function(){
                row.remove();
            });
        });
    }
});
于 2009-12-14T21:35:41.383 回答
0

尝试上链

$('#delete_link_'+id).parents('tr').slideUp();
于 2009-12-14T21:34:38.810 回答
-1

我不知道您是否可以为表格行的高度设置动画。

试试这个：

$('#delete_link_'+id).closest('tr').find("td").slideUp('slow',function(){
  $(this).remove();
});

未经测试，顺便说一句。

于 2009-12-14T21:38:26.730 回答