我正在学习WordPress,正在制作联系我们表单。我正在使用jQuery验证。我正在使用以下代码。
function contact($atts){
$html=\'<form name="invite" id="contactform" class="contactform" method="post" action="">
<div class="row">
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12">
<div class="form-group pb-3">
<label>Your email address</label>
<input name="email" placeholder="[email protected]" type="email" class="form-control customInput" />
</div>
</div>
<div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-xs-12">
<div class="form-group mt-3">
<label>Your Message</label>
<textarea name="message" placeholder="Your Message..." rows="6" class="form-control customInput"></textarea>
</div>
</div>
</div>
<div class="formbtn mt-5"><input type="submit" class="" name="Send Mail"></div>
</form>\';
$html.=\'<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.2/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.2/additional-methods.min.js"></script>
<script>
$(function() { // ready handler
var isReqInprogress = false;
$.validator.addMethod("emailExt", function(value, element, param) {
return value.match(/^[a-zA-Z0-9_\\.%\\+\\-]+@[a-zA-Z0-9\\.\\-]+\\.[a-zA-Z]{2,}$/);
}, "Your email id is not correct format");
$("#contactform").validate({
rules: {
email: {
required: true,
email: true,
emailExt: true
},
message: {
required: true,
minlength: 10
}
},
submitHandler: function(form) {
if (isReqInprogress) {
return;
}
$.ajax({
url: process.php ",
type: "post",
data: $("#contactform").serialize(),
dataType: "JSON",
success: function(response) {
alert("Your message has been received.");
location.reload();
isReqInprogress = false;
}
});
}
});
});
</script>\';
return $html;
} add_shortcode( \'contact-form\', \'contact\');
我的问题是,我得到了错误
未捕获引用错误:$未定义
我已经在</body>
. 我知道jquery验证在jquery之上,但如果我再次添加jquery,那么页面上将有两个jquery。
如果我从底部删除jQuery,那么我的其他脚本将无法工作。
你能帮助我处理这个问题的最好方法是什么吗?