label-success
时间: 2024-04-12 11:26:05 浏览: 98
label-success是一种在网页设计和开发中常用的CSS类名,用于给元素添加一个成功状态的标签或样式。通常情况下,label-success会将文本或元素的背景色设置为绿色,以表示成功或完成的状态。
相关问题:
1. CSS类名有哪些常用的表示不同状态的类?
2. 如何在HTML中使用label-success类名?
3. 除了成功状态,还有哪些常用的状态类名?
相关问题
使用ajax请求成功返回的数据替换下面代码中的imge_list,并给出ajax的代码 <div class="row"> {% for imge in imge_list %} {% if not class_name or imge.class_name == class_name %} <div class="col-md-6" id="imge_id" style="width: 310px"> <div class="thumbnail"> <p></p> <form action="{% url 'delete_image' %}" method="POST"> {% csrf_token %} <input type="hidden" name="image_id" value="{{ imge.id }}"> <button type="submit" class="btn btn-sm pull-right" id="delete-button">删除</button> </form> <span class="label label-primary" style="font-size: 20px;">类别</span> <span style="font-size: 20px;">{{ imge.class_name }}</span> <span class="label label-success pull-right" style="font-size: 5px;">{{ imge.confidence }}</span> <p></p> <img src="{{ imge.result_image }}" class="img-rounded" alt="..." height="300px" width="300px"> <span class="label label-info">坐标(xywh):</span> <br>{{ imge.location }}<br> <span class="label label-danger">消耗时间:</span> {{ imge.comsume_time }}<br> <span class="label label-success">预测日期:</span> {{ imge.c
// AJAX代码
$.ajax({
url: "/get_images/",
type: "GET",
success: function(data) {
// 替换imge_list
var imge_list = data.imge_list;
var html = "";
for(var i=0; i<imge_list.length; i++) {
html += '<div class="col-md-6" id="imge_id" style="width: 310px">';
html += '<div class="thumbnail">';
html += '<p></p>';
html += '<form action="{% url 'delete_image' %}" method="POST">';
html += '{% csrf_token %}';
html += '<input type="hidden" name="image_id" value="' + imge_list[i].id + '">';
html += '<button type="submit" class="btn btn-sm pull-right" id="delete-button">删除</button>';
html += '</form>';
html += '<span class="label label-primary" style="font-size: 20px;">类别</span>';
html += '<span style="font-size: 20px;">' + imge_list[i].class_name + '</span>';
html += '<span class="label label-success pull-right" style="font-size: 5px;">' + imge_list[i].confidence + '</span>';
html += '<p></p>';
html += '<img src="' + imge_list[i].result_image + '" class="img-rounded" alt="..." height="300px" width="300px">';
html += '<span class="label label-info">坐标(xywh):</span><br>' + imge_list[i].location + '<br>';
html += '<span class="label label-danger">消耗时间:</span> ' + imge_list[i].comsume_time + '<br>';
html += '<span class="label label-success">预测日期:</span> ' + imge_list[i].created_at + '<br>';
html += '</div>';
html += '</div>';
}
$(".row").html(html);
},
error: function() {
alert("请求失败!");
}
});
el-upload在on-success中带参数
在ElementUI的upload组件的on-success钩子中,只能传递response、file和fileList这三个参数。如果想要传递更多的参数,可以通过使用匿名函数来实现。在匿名函数中,可以调用自定义的函数,并将额外的参数作为参数传递给该函数。例如,在el-upload的on-success属性中,可以使用匿名函数来调用imgHandleSuccess函数,并将response和scope.row作为参数传递给该函数。具体代码如下所示:
```html
<el-table-column label="图片">
<template slot-scope="scope">
<el-upload :action="imgURL" :on-success="function(response) { imgHandleSuccess(response, scope.row) }">
<el-button size="small" type="primary">上传图片</el-button>
</el-upload>
</template>
</el-table-column>
```
在这个例子中,imgHandleSuccess函数会接收两个参数,response和scope.row。这样就可以在on-success中传递额外的参数了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [Vue - el-upload 组件在 on-success 文件上传成功的钩子中传递更多参数](https://blog.csdn.net/Jie_1997/article/details/121833421)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *3* [el-upload组件如何在on-success文件上传成功的钩子中传递更多参数](https://blog.csdn.net/louxinuo/article/details/120247565)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]