我的问题是:我有一个视频播放并在结尾附近呈现一个表格。提交表单时,我触发该视频隐藏()并显示()另一个包含2个以上视频的div。该部分工作正常,但在表单发布后,它刷新页面,我们回到原点。
我尝试过在其他帖子中找到的方法,但无济于事。 这是表格:
<form id="contactForm" action="salesforce.com address obscured" method="POST">
<input type=hidden name="oid" value="00D40000000Mvel">
<input id="first_name" maxlength="40" name="first_name" size="20" type="text" placeholder="FIRST NAME" /><br>
<input id="last_name" maxlength="80" name="last_name" size="20" type="text" placeholder="LAST NAME" /><br>
<input id="email" maxlength="80" name="email" size="20" type="text" placeholder="EMAIL" /><br>
<input id="zip" maxlength="20" name="zip" size="20" type="text" placeholder="ZIP CODE" /><br>
<button type='submit' class="submit-button" >GET STARTED!</button>
</form>
和我的jQuery减去我用来尝试阻止刷新提交的代码:
var mainVid = $("#video")
var secVid = $( "#secVid" );
$( "#videoForm button" ).on( "click", function( event ) {
mainVid.hide(400);
secVid.show(400);
});
答案 0 :(得分:0)
尝试
$('#contactForm').on('submit', function (event) {
event.preventDefault();
$.post("your url", $(this).serialize());
mainVid.hide(400);
secVid.show(400);
});
然后使用ajax请求提交表单,并且不重新加载页面。
请参阅http://api.jquery.com/event.preventDefault/和http://api.jquery.com/jQuery.post/