jQuery提交表单ajax查询实例代码,Ajax提交表单查询

作者: 关于计算机  发布:2019-09-23

看一个用jQuery提交表单ajax查询的事例。
基本功用:顾客输入三个表单,输入准考证和验证码,验证顾客是或不是输入表单,点击查询提交,然后从服务器获得重临的数量并体现出来。
代码如下:
jQuery部分:

看三个用jQuery提交表单ajax查询的事例。
基本成效:客商输入多个表单,输入准考证和验证码,验证客商是不是输入表单,点击查询提交,然后从服务器获得再次来到的多少并突显出来。

复制代码 代码如下:

代码如下:

<script language="javascript" type="text/javascript">
$(document).ready(function() {
$("#btnSubmit").click(function() {
Login();
});
});
function Login() {
if (Check()) {
LoginSuccess();
}
}
function Check() {
if ($("#ksbh").val() == "") {
alert("准考证号不能为空!");
$("#ksbh").focus();
return false;
}
if ($("#Yzm").val() != $.cookie('ValidateCode')) {
alert("验证码错误!")
$("#Yzm").focus();
return false;
}
return true;
}
function LoginSuccess() {
$.ajax({
type: "POST",
url: "/zk/zkcj201204a",
data: { ksbh: $("#ksbh").val()},
beforeSend: function() { $("#msg").html("loading......正在交付请稍候。"); },
success: function(data) {
$("#msg").html(data).show();
document.getElementById("valiCode").src = document.getElementById("valiCode").src+'?';
}
});
}
</script>

jQuery部分:

htm部分:

复制代码 代码如下:

复制代码 代码如下:

<script language="javascript" type="text/javascript">
$(document).ready(function() {
$("#btnSubmit").click(function() {
Login();
});
});
function Login() {
if (Check()) {
LoginSuccess();
}
}
function Check() {
if ($("#ksbh").val() == "") {
alert("准考证号不可能为空!");
$("#ksbh").focus();
return false;
}
if ($("#Yzm").val() != $.cookie('ValidateCode')) {
alert("验证码错误!")
$("#Yzm").focus();
return false;
}
return true;
}
function LoginSuccess() {
$.ajax({
type: "POST",
url: "/zk/zkcj201204a",
data: { ksbh: $("#ksbh").val()},
beforeSend: function() { $("#msg").html("loading......正在交付请稍候。"); },
success: function(data) {
$("#msg").html(data).show();
document.getElementById("valiCode").src = document.getElementById("valiCode").src+'?';
}
});
}
</script>

<div id="lmain">
<div><span class="s1">准考证号:</span><span class="s2"><input id="ksbh" maxlength="12" name="ksbh" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))" onkeyup="value=value.replace(/[^d]/g,'')" type="text" value="" /></span></div>
<div><span class="s1">验证码:</span><span class="s3"><input id="Yzm" name="Yzm" type="text" value="" /><img id="valiCode" style="cursor: pointer;height:22px; line-height:22px; vertical-align:middle;" src="../Validate/GetValidateCode" onclick="this.src=this.src+'?'" alt="看不清?点击更动" /></span></div>
<div style=" text-align:center;"><input type="button" id="btnSubmit" value="查询" /> </div>
</div>
<div id="msg" style=" width:600px;text-align:center; margin-top:20px;"></div>

htm部分:

你恐怕感兴趣的小说:

  • jquery ajax提交表单数据的二种艺术
  • jQuery使用ajaxSubmit()提交表单示例
  • jQuery ajax中动用serialize()方法提交表单数据示例
  • jquery+ajax验证不经过也交给表单难点管理
  • jQuery Ajax提交表单查询得到多少实例代码
  • jquery ajax提交表单数据的三种达成形式
  • Jquery基于Ajax方法自定义无刷新提交表单Form实例
  • jquery ajax 怎样向jsp提交表单数据
  • jQuery ajaxSubmit 达成ajax提交表单局地刷新
  • jQuery基于Ajax格局交给表单功效示例

复制代码 代码如下:

<div id="lmain">
<div><span class="s1">准考证号:</span><span class="s2"><input id="ksbh" maxlength="12" name="ksbh" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))" onkeyup="value=value.replace(/[^d]/g,'')" type="text" value="" /></span></div>
<div><span class="s1">验证码:</span><span class="s3"><input id="Yzm" name="Yzm" type="text" value="" /><img id="valiCode" style="cursor: pointer;height:22px; line-height:22px; vertical-align:middle;" src="../Validate/GetValidateCode" onclick="this.src=this.src+'?'" alt="看不清?点击改动" /></span></div>
<div style=" text-align:center;"><input type="button" id="btnSubmit" value="查询" /> </div>
</div>
<div id="msg" style=" width:600px;text-align:center; margin-top:20px;"></div>

你大概感兴趣的文章:

  • jquery ajax提交表单数据的三种办法
  • jQuery使用ajaxSubmit()提交表单示例
  • jQuery ajax中央银行使serialize()方法提交表单数据示例
  • jquery+ajax验证不通过也提交表单难点管理
  • jquery ajax提交表单数据的三种达成格局
  • Jquery基于Ajax方法自定义无刷新提交表单Form实例
  • jquery ajax 怎样向jsp提交表单数据
  • jQuery提交表单ajax查询实例代码
  • jQuery ajaxSubmit 达成ajax提交表单局地刷新
  • jQuery基于Ajax情势提交表单效用示例
  • 局地jQuery表单实例 Ajax表单推断代码打包

本文由今晚买四不像发布于关于计算机,转载请注明出处:jQuery提交表单ajax查询实例代码,Ajax提交表单查询

关键词: