问题情境:通过append添加的元素(标签),每次执行这个js方法时,就会再次拼接,所以要进行判断,如果存在便删除。
这个问题本身并不复杂,但是我在写的时候脑袋短路了,$("#id") 我没有写#号(还是写的少的原因吧),结果以为直接通过if($("#id") )判断是否存在不可行,于是便绕道而行,但虽费劲周折却也学到了很多知识,下面整理一下。
1,为了方便删除append添加的元素,应把要拼接的标签定义成一个jQuery对象,这样方便以后删除,其实也可以通过给标签添加id来删除。
代码:
<script type=
"text/javascript"
>
$(document).ready(
function
(){
$html = $(
"<div class='win_box'><ul class='title'><li class='close' id='_close'>关闭</li></ul></div><div class='win'></div>"
);
$(
"#_askde"
).click(
function
(){
$(
"body"
).append($html);
//必须节点存在文档内才可添加事件。否则要使用live或者on来绑定事件
$(
"#_close"
).click(
function
(){
$html.remove();
//事先存好了对象就方便删除了
});
});
});
</script>
2,typeof的用法,用来判断获得对象的类型。
JS中的变量是松散类型(即弱类型)的,可以用来保存任何类型的数据。
typeof 可以用来检测给定变量的数据类型,可能的返回值:1. 'undefined' --- 这个值未定义;
2. 'boolean' --- 这个值是布尔值;
3. 'string' --- 这个值是字符串;
4. 'number' --- 这个值是数值;
5. 'object' --- 这个值是对象或null;
6. 'function' --- 这个值是函数。
1) var aa = 'test string';
alert(typeof aa); // 'string'
alert(typeof 90); // 'number'
2)
if(typeof $("#myLable").html() != "undefined") {
// $lable.remove();
$("#myLable").remove();
}
3,bootstrap模态框关闭执行事件的方法
代码://模态框关闭时触发的事件
$(function () { $('#processModal').on('hidden.bs.modal', function () {
$("#myLable").remove();
$("#myDiv").remove();
})
}); */
4,这是三天之后增加的,因为涉及到appen的问题,所以把它放到这篇文章里
1)append为表格拼接行,直接在tbody上增加一个id属性,然后通过jQuery得到这个tbody的jQuery对象,然后直接拼接自己的行就可以,代码如下
table部分:
<table class="table table-condensed table-hover table-bordered " style="width: 80%;margin-left:100px;" >js部分:
<thead style="padding-left :50px">
<tr>
<th>附件标题</th>
<th>相关操作</th>
</tr>
</thead>
<tbody id="attachmentTable">
</tbody>
</table>
//拼接已上传附件其中我给每一行的id属性设置为每个附件自己在数据库的id,这样到后面想删除的时候,可以根据id直接删除了,如下
var str = "";
str += "<tr id='"+data.attachment.id+"'><td>"+data.attachment.title+"</td><td>";
//拼接删除按钮
str += "<button class='btn btn-danger btn-xs' onclick='att_del('"+data.attachment.id+"');'><i class='fa fa-minus'></i> 删除附件</button>";
str += "</td></tr>";
$("#attachmentTable").append(str);
$("#"+attId).remove();
如果您有更好的方法也不要忘记写出来。