我想使用append添加html代码,但是当第二次添加时,输入中的文本不会跟随新行:
HTML:
'<form>' +
'<input type="text" id="newFoldr" name="fname" placeholder=".ex nameFanpage" value="">' +
'<input type="button" class="cancelButton" id="cancelButton" value="Cancel" data-dismiss="modal" aria-label="Close">' +
'<input type="button" class="submitButton" id="submitButton" value="Create" style="width:142px;margin-left: 5px;">' +
'</form>' +
Javascript:
$('.submitButton').click(function () {
var addFolder = '<div class="_5bm7 _2mk4" role="presentation" style="height: 50px;border:none;"><div class="_5bmf"></div>' +
'<div class="_1577">' +
'<div class="ellipsis">' +
'<div class="_1i5z"><div class="_1i5-">' +
'</div>' +
'</div>' +
'<span id="namaFolder"></span>' +
'</div>' +
'</div>' +
'</div>';
if( document.getElementById("newFoldr").value === '' ){
swal("Whoops!", "You need to write something!", "info");
} else {
$('.columnFolder').append(addFolder);
var inputan = document.getElementById("newFoldr").value;
document.getElementById("namaFolder").innerHTML= inputan;
swal("Success!", "Your folder has been created!", "success");
}
});
答案 0 :(得分:0)
如果您无法清除输入值,只需在else块中添加以下代码
document.getElementById("newFoldr").value = "";
完整的javascript代码如下
$('.submitButton').click(function () {
var addFolder = '<div class="_5bm7 _2mk4" role="presentation" style="height: 50px;border:none;"><div class="_5bmf"></div>' +
'<div class="_1577">' +
'<div class="ellipsis">' +
'<div class="_1i5z"><div class="_1i5-">' +
'</div>' +
'</div>' +
'<span></span>' +
'</div>' +
'</div>' +
'</div>';
if( document.getElementById("newFoldr").value === '' ){
swal("Whoops!", "You need to write something!", "info");
} else {
$('.columnFolder').append(addFolder);
var inputan = document.getElementById("newFoldr").value;
$('.columnFolder div._5bm7._2mk4:last').find('span').text(inputan);
document.getElementById("newFoldr").value = "";
swal("Success!", "Your folder has been created!", "success");
}
});