如何刷新/重载滑出面板(jquery)
How to refresh/reload a slide out panel (jquery)
我有这个带有评论表单的幻灯片面板,在用户提交评论表单后,将出现"THANK YOU",问题是,当我关闭面板并再次滑出第二个评论时,"THANK YOU"仍然在那里!我希望能看到一个新的未填写的评论表。
我如何有一个新的新的原始评论表单显示,而不是从以前的会话剩余?
代码:<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.post("comment.pl", {
comment:$("#comment").val(),
},
function(data,status){
document.getElementById('div2').innerHTML = "THANK YOU";
});
});
});
</script>
</head>
<body>
<div data-role="page" id="pageone">
<div data-role="main" class="ui-content">
<p>Click on the link to see the slide effect.</p>
<a href="#pagetwo" data-transition="slide">Slide to Dialog Page</a>
</div>
</div> <!-- pageone -->
<div data-role="popup" data-dialog="true" id="pagetwo" >
<div data-role="main" class="ui-content">
<div id="div2">
<b>Enter Comment</b>
<br>
<textarea name="comment" id="comment" data-role="none" rows=5 cols=30 onkeypress="if(event.keyCode==13){return false;}" onKeyDown="limitText2(this,100);" onKeyUp="limitText2(this,100);" style="resize:none;"></textarea>
<br>
<button data-inline="true"><font size=+2 color=#333333>Enter</font></button>
<a href="#pageone" data-ajax="false">Go to Page One</a>
</div> <!-- div2 -->
</div> <!-- ui-content -->
</div> <!-- pagetwo -->
</body>
</html>
与其更改div2
的内容,不如将.append
或.show
作为元素。如果我们在运行时重新创建div2的内容,我们需要在这段新代码上重新应用所有JS,以便刷新它并使其能够正确发布数据。
因此,创建一个#success
div,在单击按钮时显示:
...
function(data,status){
$('#success').show();
});
...
当页面过渡动画完成时运行一个事件:
$( document ).bind( "mobileinit", function() {
$('div[data-role="main"]').live('pagehide',function(event, ui){
//the 'pageHide' happens when the main is hidden
$('#success').hide();
});
});
相关文章:
- Jquery在刷新时返回元素的旧值
- JQuery-自动刷新(重复表单)
- ajax更新后jQuery列表刷新
- 在初始表单提交后使用ajax/jQuery自动刷新,然后更改页面标题
- Ember.js在模板渲染上加载jquery(无刷新)
- jQuery AJAX刷新没有'不能在iPhone上工作
- jQuery除非刷新,否则不显示实时数据
- Jquery滑动刷新移动网页
- jQuery .load:刷新页面时加载同一页面的任何方法
- 阻止 jquery 移动刷新表单提交
- Jquery 在刷新页面时保持在每个页面上选择的选项卡
- 如何通过jQuery动态刷新幻灯片JS
- jQuery 在刷新时显示隐藏的内容
- Jquery/Javascript刷新单击()
- jQuery在刷新之前不会加载
- JQuery-自动刷新页面的一部分
- HTML/jQuery在刷新时只更改部分URL
- 使用JQuery自动刷新DIV
- Jquery在刷新页面时重置
- jquery自动刷新页面