2013-12-19 60 views
0

的某些部分我有含有由逗号分隔值(锚标记)的列表的TD。jQuery的:删除字符串

有什么办法,我可以创建一个按钮来删除特定值超出这个字符串,例如第一或第二或第三个值?

我第一次尝试用tagsmanager插件来解决这一点,但所有的tagsmanagers我所以上面的意思为工作在这里只知道与文本,但不链接/锚标记工作。

背景是我有一个页面,显示上传文件列表作为链接(使用PHP创建),我希望允许用户能够删除一个或多个这些链接,如果不再需要。所有链接的值是文件和数字,例如文件1,文件2,文件3等

如TD:

<td> 
<a href="link1" target="_blank">File 1</a>,<a href="link2" target="_blank">File 2</a>,<a href="link3" target="_blank">File 3</a>,<a href="link4" target="_blank">File 4</a>,<a href="link5" target="_blank">File 5</a> 
</td> 

感谢与此任何帮助,添。

回答

1

可以实现多种方式这种效果。如果你想有一个单独的按钮来删除每个链接,这个可能很有用。

只要将每一个环节后buttonclick分配事件是这样的:

$('button').click(function(){ 
    $(this).prev('a').remove(); 
    $(this).remove(); 
}); 

DEMO

+0

我将使用此解决方案 - 非常感谢您的帮助! – user2571510

1

你最简单的解决办法是包装在<span>标签的物品(和逗号):

<span class="file1"><a href="link1" target="_blank">File 1</a>,</span> 
<span class="file2"><a href="link2" target="_blank">File 2</a>,</span> 
<span class="file3"><a href="link3" target="_blank">File 3</a>,</span> 
<span class="file4"><a href="link4" target="_blank">File 4</a>,</span> 
<span class="file5"><a href="link5" target="_blank">File 5</a></span> 

然后,你可以简单地使用jQuery删除整个span

$('.file1').remove(); 
2

可以设置对TD有一个像<td id="myID">一个ID,然后你可以很容易选择TD的使用jQuery的第n个孩子:

var index = 4; // or whatever you want it to be 
$("#myID a:nth-child(" + index + ")").remove(); 

如果你不想设置TD的ID,你当然可以使用

$("td:nth-child(" + tdNum + ")"); // for the td 
$("td:nth-child(" + tdNum + ") a:nth-child(" + linkNum + ")"); // for the links 
+0

感谢。这会在IE 8和IE 9中工作吗? – user2571510

+0

适用于IE 7,8和9。(在线模拟器测试过,不知道肯定) – anestv

1

选择另一种方式,例如我会做链接看起来像可点击标签,点击它时会删除自己。

<td> 
    <a href="link1" target="_blank">File 1</a> 
    <a href="link2" target="_blank">File 2</a> 
    <a href="link3" target="_blank">File 3</a> 
    <a href="link4" target="_blank">File 4</a> 
    <a href="link5" target="_blank">File 5</a> 
</td> 

然后用JavaScript使链接 “删除” 上点击

$('a').on('click', function(e){ 

    this.remove(); // remove the clicked "<a>" tag 

    e.preventDefault(); // prevents the link from going anywhere 
}) 

这里是一个working example

而且here is an example,可以让你获得更多的信息有关的每个点击链接所以你可以做一个服务器端请求删除项目