Jquery滑动功能未激活的接触表单脚本
Jquery slide up function not activating in contact form script
一切都在这个联系表单上工作,除了最后一点使用滑动功能将联系表单替换为感谢信息,我似乎无法破解我的解决方案。
你填写表单,点击提交,电子邮件发送,加载gif出现,但幻灯片动画从来没有发生,感谢图片从来没有显示。
<!--CONTACT PANEL-->
<div id="contact-panel">
<div class="top">: : CONTACT ME : :</div>
<form id="contactform" method="post">
<ol class="forms">
<fieldset>
<label for="name"><input type="text" name="name" id="name" value="" placeholder="Name:" required minlength="2" /></label>
</fieldset>
<p style="margin-top: -10px;"><label for="name" class="error"></label></p>
<fieldset>
<label for="email"><input type="text" name="email" id="email" value="" placeholder="Email:" required /></label>
</fieldset>
<p style="margin-top: -10px;"><label for="email" class="error"></label></p>
<fieldset>
<label for="message"><textarea name="message" id="message" placeholder="Question/Comments:" required ></textarea></label>
</fieldset>
<p style="margin-top: -5px;"><label for="message" class="error"></label></p>
<li class="buttons"><button type="submit" id="submitemail">Send Email »</button><input type="hidden" name="submitted" id="submitted" value="true" /></li>
</ol>
</form>
</div>
这是JS…
$(document).ready(function () {
$("#contactform").validate({
rules: {
name: {
required: true,
minlength: 2
},
email: {
required: true,
email: true
},
message: {
required: true,
minlength: 10
},
},
messages: {
name: {
required: "*Please enter your name.",
minlength: "*Your name must consist of at least 2 characters."
},
email: "*Please enter a valid email address.",
message: "*Please, say something at least 10 characters long.",
},
submitHandler: function(form) {
$('#submitemail').hide();
$("#contactform li.buttons").append('<img src="media/contact/loading.gif" alt="Loading" id="loading" />');
$.post('code/form-contact/submitcontactform.php',
$('form#contactform').serialize(),
function(data){
$("#contactform").slideUp("normal", function() {
$("#contactform").before('<img src="media/contact/contact_thankyou.png" alt="Thank You" id="thankyou" />');
});
});
},
})
return false;
});
我已经尝试了很多不同的方法,但除了猜测和试错之外,我知道的还不够多。欢迎任何帮助。
我对messages json做了如下更改:
messages: {
name: {
required: "*Please enter your name.",
minlength: "*Your name must consist of at least 2 characters."
},
email:
{
email: "*Please enter a valid email address.",
required: "Please enter email address."
},
message:
{
minlength: "*Please, say something at least 10 characters long.",
required: "Please enter message"
}
},
为了使它在小提琴中工作,我不得不删除post call,因为jsfiddle不支持它:
http://jsfiddle.net/shifatullah/v3dTz/16/相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何使用WCF服务和javascript表单post上传.doc文件
- Javascript生成的表单未提交
- 如何使用javascript或html下载PDF格式的填写表单
- HTML表单提交时未执行外部函数
- 如何将输入(type=text)从html表单传递到javascript函数
- 通过单击表单中的按钮,在代码生成中使用javascript生成字母数字代码
- Ajax发布表单序列化,发布引号'
- 多级HTML表单
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 在验证和发送邮件后更改联系人表单的 html
- jQuery表单添加不适用于下拉列表
- Rails/JSON:如何将JSON用于jquery UI自动完成表单
- 如何从pdftron webviewer获取表单数据
- JS验证ajax返回的html中的表单数据
- Javascript更新孙窗口中的表单元素
- 解析javascript表单验证器
- 接触表单7不工作在引导模式
- 改变& # 39;html # 39;在接触表单弹出和关闭时溢出属性
- Jquery滑动功能未激活的接触表单脚本