Javascript $(“表单”)。提交不适用于ipad和iphone
我有一个简单的post表单,可以在所有浏览器中使用,但当它出现在ipad/iphone上时(顺便说一句,我是这个世界上iOS的新手),我遇到了一个问题Javascript $(“表单”)。提交不适用于ipad和iphone,javascript,jquery,iphone,ipad,asp.net-mvc-5,Javascript,Jquery,Iphone,Ipad,Asp.net Mvc 5,我有一个简单的post表单,可以在所有浏览器中使用,但当它出现在ipad/iphone上时(顺便说一句,我是这个世界上iOS的新手),我遇到了一个问题 <form action="/Home/Contact" id="contactform" method="post" novalidate="novalidate"> <div class="response"></div> <p> <
<form action="/Home/Contact" id="contactform" method="post" novalidate="novalidate">
<div class="response"></div>
<p>
<input class="textfield" data-val="true" data-val-length="The Name must be 50 characters or less" data-val-length-max="50" data-val-regex="The Name should not contain special characters" data-val-regex-pattern="^[A-Za-z0-9-_ ]+$" data-val-required="The Name field is required." id="Name" name="Name" placeholder="Name" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-email="The Email field is not a valid e-mail address." data-val-length="The Email must be 200 characters or less" data-val-length-max="200" data-val-required="The Email field is required." id="Email" name="Email" placeholder="Email" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-length="The Subject must be 255 characters or less" data-val-length-max="255" data-val-required="The Subject field is required." id="Subject" name="Subject" placeholder="Subject" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Subject" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<textarea class="textarea" cols="20" data-val="true" data-val-length="The Message must be 2000 characters or less" data-val-length-max="2000" data-val-required="The Message field is required." id="Message" name="Message" placeholder="Message" rows="8"></textarea>
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Message" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<button type="submit" name="submit" id="submitButton" title="Click here to submit your message!" class="btn btn-red">Submit</button>
</p>
</form>
当我单击submit时,代码根本没有执行
更新1:
如果我更改为$(“#contactform”)。提交(…)
或$(“#提交按钮”)。单击(…)
在iphone和ipad上仍然不走运
更新2
如果我像@Sridhar-R一样使用action=“javascript:chk()”
。但是为什么javascript post在action=“/Home/Contact”
-这都是因为在iphone/ipad中javascript post只能以这种方式工作?试试这个
<form action="javascript:chk()" id="contactform" method="post" novalidate="novalidate">
<div class="response"></div>
<p>
<input class="textfield" data-val="true" data-val-length="The Name must be 50 characters or less" data-val-length-max="50" data-val-regex="The Name should not contain special characters" data-val-regex-pattern="^[A-Za-z0-9-_ ]+$" data-val-required="The Name field is required." id="Name" name="Name" placeholder="Name" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-email="The Email field is not a valid e-mail address." data-val-length="The Email must be 200 characters or less" data-val-length-max="200" data-val-required="The Email field is required." id="Email" name="Email" placeholder="Email" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-length="The Subject must be 255 characters or less" data-val-length-max="255" data-val-required="The Subject field is required." id="Subject" name="Subject" placeholder="Subject" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Subject" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<textarea class="textarea" cols="20" data-val="true" data-val-length="The Message must be 2000 characters or less" data-val-length-max="2000" data-val-required="The Message field is required." id="Message" name="Message" placeholder="Message" rows="8"></textarea>
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Message" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<button type="submit" name="submit" id="submitButton" title="Click here to submit your message!" class="btn btn-red">Submit</button>
</p>
</form>
这样它就工作了。但是为什么它不能以另一种方式工作呢?因为您的表单已经有了再次提交表单的操作,所以您的处理程序尝试使用ajax发布,这就是为什么它不能工作的原因尝试使用任何一个它都可以100%工作的副本
<form action="javascript:chk()" id="contactform" method="post" novalidate="novalidate">
<div class="response"></div>
<p>
<input class="textfield" data-val="true" data-val-length="The Name must be 50 characters or less" data-val-length-max="50" data-val-regex="The Name should not contain special characters" data-val-regex-pattern="^[A-Za-z0-9-_ ]+$" data-val-required="The Name field is required." id="Name" name="Name" placeholder="Name" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-email="The Email field is not a valid e-mail address." data-val-length="The Email must be 200 characters or less" data-val-length-max="200" data-val-required="The Email field is required." id="Email" name="Email" placeholder="Email" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<input class="textfield" data-val="true" data-val-length="The Subject must be 255 characters or less" data-val-length-max="255" data-val-required="The Subject field is required." id="Subject" name="Subject" placeholder="Subject" type="text" value="">
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Subject" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<textarea class="textarea" cols="20" data-val="true" data-val-length="The Message must be 2000 characters or less" data-val-length-max="2000" data-val-required="The Message field is required." id="Message" name="Message" placeholder="Message" rows="8"></textarea>
</p><div class="error-holder"><span class="field-validation-valid" data-valmsg-for="Message" data-valmsg-replace="true"></span></div>
<p></p>
<p>
<button type="submit" name="submit" id="submitButton" title="Click here to submit your message!" class="btn btn-red">Submit</button>
</p>
</form>
function chk(e){
if (!$("form").valid())
return false;
var name = $('input#Name').val();
var email = $('input#Email').val();
var subject = $('input#Subject').val();
var message = $('textarea#Message').val();
$.ajax({
type: 'post',
url: '/home/contact',
data: JSON.stringify({ name: name, email: email, subject: subject, message: message }),
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
success: function(result) {
//do stuff
},
error: function(result) {
//do stuff
}
})
return false;
}