<HTML>
<HEAD>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#delrow').click(function(){
alert(':)');
$(this).closest('tr').animate({'backgroundColor':'#EF3E23','color':'#fff'},300,function(){
$(this).remove();
});
return false;
});
});
</script>
</HEAD>
<BODY>
Hello
<table>
<tr>
<td>abc</td>
<td><a id="delrow" title="Click to remove" href="#">Delete</a></td>
</tr>
</table>
</BODY>
</HTML>
在这里你可以测试我的代码:http://goo.gl/XNQb5j
“删除”按钮应该从表格中删除该行。 当我不包含 jQuery UI 时它工作正常(但是,当然,动画不工作)。 我做错了什么?
抱歉我的英语错误。
最佳答案
您链接的 jQuery UI 版本与您链接的 jQuery 版本不兼容。最好从他们网站上的 jQuery 示例中获取版本号。
注意当版本兼容时您的代码如何工作:
<HTML>
<HEAD>
<script src="http://code.jquery.com/jquery-2.0.2.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#delrow').click(function() {
alert(':)');
$(this).closest('tr').animate({
'backgroundColor': '#EF3E23',
'color': '#fff'
}, 300, function() {
$(this).remove();
});
return false;
});
});
</script>
</HEAD>
<BODY>Hello
<table>
<tr>
<td>abc</td>
<td><a id="delrow" title="Click to remove" href="#">Delete</a>
</td>
</tr>
</table>
</BODY>
</HTML>
关于javascript - 添加 jQuery UI 后,从表中删除行的函数不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28384119/