在 ajax 成功后删除最接近的 li
Remove closest li after ajax success
我有一个列出所有上传文件的div
$i = 0;
echo '<div style="float: left;margin-left: 25px;" id="filecontainer">';
echo "<ul>";
foreach($editorderdata['uploadedfiles'] as $row){
echo '<li>';
echo '<a href="'.base_url().'images/userfiles/'.$row['filename'].'" target="_blank">';
echo 'file_'.++$i.'</a>';
echo '<a href="#" data-fileid="'.$row['filename'].'" title="Remove file" class="removefile">';
echo '<img class="cross" src="'.base_url().'images/cross.png">';
echo '</a></li>';
}
echo "</ul>";
echo "</div>";
这是在按 .removefile 类元素时删除所选文件的代码
$(document).ready(function() {
$(".removefile").click(function(e) {
e.preventDefault();
var fileidvar = $(this).data('fileid');
if (confirm("Are you sure you want to remove selected file?")) {
$.ajax({
type: "POST",
url:'<?php echo base_url() ?>signup/removefile',
data:{ fileid: fileidvar },
dataType: 'json',
success: function (data) {
if(data.value){
alert(data.value);
$(this).closest("li").remove();
}
},
error:function(){
alert("Something went wrong, please try again.");
}
});
}
return false;
});
});
代码工作正常,但我想要的是删除 ajax 成功时不起作用的父 li.. 帮助?
您遇到的问题是success
处理程序中的$(this)
不等于单击的元素。试试这个:
$(".removefile").click(function(e) {
e.preventDefault();
var $btn = $(this); // <- save the clicked button to a variable
var fileidvar = $btn.data('fileid');
if (confirm("Are you sure you want to remove selected file?")) {
$.ajax({
type: "POST",
url:'<?php echo base_url() ?>signup/removefile',
data: { fileid: fileidvar },
dataType: 'json',
success: function (data) {
if (data.value) {
alert(data.value);
$btn.closest("li").remove(); // <- use cached selector here
}
},
error: function() {
alert("Something went wrong, please try again.");
}
});
}
return false;
});
像这样尝试,
if (confirm("Are you sure you want to remove selected file?")) {
var self=this;// make a copy of this to self and use it in ajax function
$.ajax({
type: "POST",
url:'<?php echo base_url() ?>signup/removefile',
data:{ fileid: fileidvar },
dataType: 'json',
success: function (data) {
if(data.value){
alert(data.value);
$(self).closest("li").remove();// use self in place of this
}
},
error:function(){
alert("Something went wrong, please try again.");
}
});
}
试试这样。
$(".removefile").click(function(e) {
e.preventDefault();
var this = $(this);
var fileidvar = $(this).data('fileid');
if (confirm("Are you sure you want to remove selected file?")) {
$.ajax({
type: "POST",
url:'<?php echo base_url() ?>signup/removefile',
data:{ fileid: fileidvar },
dataType: 'json',
success: function (data) {
if(data.value){
alert(data.value);
this.closest("li").remove();
}
},
error:function(){
alert("Something went wrong, please try again.");
}
});
}
return false;
});
希望这有帮助
问题$(this)
不是单击的元素。
所以我们在这里缓存选择器var this1 = $(this);
$(".removefile").click(function (e) {
var this1 = $(this);
e.preventDefault();
var fileidvar = $(this).data('fileid');
if (confirm("Are you sure you want to remove selected file?")) {
$.ajax({
type: "POST",
url: '<?php echo base_url() ?>signup/removefile',
data: {
fileid: fileidvar
},
dataType: 'json',
success: function (data) {
if (data.value) {
alert(data.value);
this1.closest("li").remove();
}
},
error: function () {
alert("Something went wrong, please try again.");
}
});
}
return false;
});
尝试更改:
$(this).closest("li").remove();
自
$(this).parent().remove();
相关文章:
- 获取最接近的数组数
- 从同级字符串中指定最接近的元素类
- 当使用'最接近的':jQuery
- 如何使刻度四舍五入到最接近的 # 的倍数
- 如何根据数值通过数据属性进行搜索并获得最接近的值
- 通过搜索最接近的类来更改类
- 获取TR之外最接近的隐藏值
- JQuery获取最接近的元素并筛选子元素
- 获取最接近所选选项的最快方式
- j查询树遍历从子级到最接近过滤的父级
- JavaScript:如何在最接近值的关联数组中查找键
- jquery onclick 切换最接近的 UL
- 在 javascript 数组中搜索最接近的下一个值
- 如何确定乘以后将使您最接近目标数字的数字
- 单击按钮,如何获取与类最接近的td值
- javascript代码查找最接近零的tescase
- 未获得最接近0的结果
- 显示与img最接近的li的JQuery Filter
- 在 ajax 成功后删除最接近的 li
- jQuery最接近li的类不起作用