我想在不刷新页面的情况下添加一个 div。
这是我的 Javascript:
<input class="btnsubmit" type="button" value="+Add Trivia" id="add_triviamodal">
function add_trivia()
{
var PHOTO_TRIVIA = CKEDITOR.instances.Trivia_Photo.getData();
var TITLE_TRIVIA = $('#TRIVIA_TITLE').val();
var CAPTION_TRIVIA = CKEDITOR.instances.triviacap.getData();
$.post('insert_home.php',{TRIVIA_TITLE:TITLE_TRIVIA,TRIVIA_PHOTO:PHOTO_TRIVIA,TRIVIA_CAP:CAPTION_TRIVIA}).done(function(data){
alert ("Trivia Successfully Added");
location.reload(); \\what i do is just refresh the page
});
}
这就是我输出将使用上面的 ajax 添加的数据的方式
echo "<div class=\"view view-sixth\">
".$Tri_IMAGE."
<div class=\"mask\">
<div class=\"divbutton\">
<input onclick='TRIVIA_EDIT($Tri_ID);' class=\"btnsubmit\" type=\"button\" value=\"Edit\" id=\"edit_trivia\">
<input onclick='TRIVIA_DELETE($Tri_ID,this);' class=\"btnsubmit\" type=\"button\" value=\"Delete\" id=\"delete_trivia\">
</div>
<h2>".$Tri_TITLE."</h2>
<p>".$Tri_CAPTION."</p>
</div>
</div>";
}
最佳答案
您可以使用 append()
在 jQuery 中将元素附加到 DOM。如果 div 由您的 PHP 返回。然后使用 $('#trivias').append(data);
将其附加到 DOM 元素。
编辑(以问题作者代码为例):
我已经替换了 location.reload()
部分代码附加返回的 div。
$.post('insert_home.php',{TRIVIA_TITLE:TITLE_TRIVIA,TRIVIA_PHOTO:PHOTO_TRIVIA,TRIVIA_CAP:CAPTION_TRIVIA}).done(function(data){
$('#trivias').append(data);
}
这里我假设您有一个带有 trivias id 的元素。例如<div id="trivias">...</div>
已经在您的代码中的某处。
关于php - 在不刷新 jquery 的情况下附加一个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21128347/