AJAX验证无效（提交按钮启用/禁用）
我的ajax表格有4个字段。
条件如下：
最初，submit按钮被禁用。
输入有效的，未注册的电子邮件ID和有效的手机号码后，应启用此submit按钮。
但即使我输入已注册的电子邮件ID并且有效的手机号码按钮已启用，但实际上它应该被禁用，因为输入的email-id已存在于数据库中。
图片1：
图片2：
代码段：
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript">
<!--
pic1 = new Image(16, 16);
pic1.src = "loader.gif";
$(document).ready(function()
{
$("#email").change(function()
{
var eml = $("#email").val();
$("#status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "echeck.php",
data: "email="+ eml,
success: function(msg)
{
$("#status").ajaxComplete(function(event, request, settings)
{
if(msg == 'Not Exists')
{
$("#email").removeClass('object_error'); // if necessary
$("#email").addClass("object_ok");
$(this).html(' ');
$('#submit').removeAttr('disabled');
}
else
{
$("#email").removeClass('object_ok'); // if necessary
$("#email").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
});
$("#mobile").change(function()
{
var mbe = $("#mobile").val();
if(mbe.length >= 10)
{
$("#mstatus").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "mcheck.php",
data: "mobile="+ mbe,
success: function(msg)
{
$("#mstatus").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#mobile").removeClass('object_error'); // if necessary
$("#mobile").addClass("object_ok");
$(this).html(' ');
$('#submit').removeAttr('disabled');
}
else
{
$("#mobile").removeClass('object_ok'); // if necessary
$("#mobile").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
}
else
{
$("#mstatus").html('<font color="red">The Mobile should have at least <strong>10</strong> characters.</font>');
$("#mobile").removeClass('object_ok'); // if necessary
$("#mobile").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$("#proposedby").change(function()
{
var pisa = $("#proposedby").val();
if(pisa.length >= 4)
{
$("#proposedby_status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "pcheck.php",
data: "proposedby="+ pisa,
success: function(msg)
{
$("#proposedby_status").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#proposedby").removeClass('object_error'); // if necessary
$("#proposedby").addClass("object_ok");
$(this).html(' ');
$('#submit').removeAttr('disabled');
}
else
{
$("#proposedby").removeClass('object_ok'); // if necessary
$("#proposedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
$(this).html(msg);
}
});
}
});
}
else
{
$("#proposedby_status").html('<font color="red">The Proposed by ISA No should have at least <strong>4</strong> characters.</font>');
$("#proposedby").removeClass('object_ok'); // if necessary
$("#proposedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$("#secondedby").change(function()
{
var sisa = $("#secondedby").val();
if(sisa.length >= 4)
{
$("#secondedby_status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "scheck.php",
data: "secondedby="+ sisa,
success: function(msg)
{
$("#secondedby_status").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#secondedby").removeClass('object_error'); // if necessary
$("#secondedby").addClass("object_ok");
$(this).html(' ');
$('#submit').removeAttr('disabled');
}
else
{
$("#secondedby").removeClass('object_ok'); // if necessary
$("#secondedby").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
}
else
{
$("#secondedby_status").html('<font color="red">The Seconded by ISA No should have at least <strong>4</strong> characters.</font>');
$("#secondedby").removeClass('object_ok'); // if necessary
$("#secondedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$('#submit').attr('disabled', 'disabled');
});
-->
</script>
<center>
<div align="center">
<h2 align="center">AJAX Username Verification</h2>
<form action="#" method="post">
<table width="700" border="0">
<tr>
<td width="200"><div align="right">Email-Id: </div></td>
<td width="100"><input type="email" id="email" name="email" pattern="^[a-zA-Z0-9-\_.]+@[a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,3}$" /></td>
<td width="400" align="left"><div id="status"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Mobile: </div></td>
<td width="100"><input type="text" name="mobile" id="mobile" pattern="^[0-9-]+" maxlength="10" /></td>
<td width="400" align="left"><div id="mstatus"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Proposed By (Isa no): </div></td>
<td width="100"><input type="text" name="proposedby" id="proposedby" /></td>
<td width="400" align="left"><div id="proposedby_status"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Seconded By (Isa no): </div></td>
<td width="100"><input type="text" name="secondedby" id="secondedby" /></td>
<td width="400" align="left"><div id="secondedby_status"></div></td>
</tr>
<tr>
<td colspan="3"><input type="submit" name="submit" id="submit" value="submit" /></td>
</tr>
</table>
</form>
</div>
</center>
1 个答案:
答案 0 :(得分：0)
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript">
<!--
pic1 = new Image(16, 16);
pic1.src = "loader.gif";
$(document).ready(function()
{
var flagemail=false;
var flagemobile=false;
var flagepropesed=false;
var flagesecondby=false;
$("#email").change(function()
{
var eml = $("#email").val();
$("#status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "echeck.php",
data: "email="+ eml,
success: function(msg)
{
$("#status").ajaxComplete(function(event, request, settings)
{
if(msg == 'Not Exists')
{
$("#email").removeClass('object_error'); // if necessary
$("#email").addClass("object_ok");
$(this).html(' ');
flagemail=true;
}
else
{
$("#email").removeClass('object_ok'); // if necessary
$("#email").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
});
$("#mobile").change(function()
{
var mbe = $("#mobile").val();
if(mbe.length >= 10)
{
$("#mstatus").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "mcheck.php",
data: "mobile="+ mbe,
success: function(msg)
{
$("#mstatus").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#mobile").removeClass('object_error'); // if necessary
$("#mobile").addClass("object_ok");
$(this).html(' ');
flagemobile=true;
}
else
{
$("#mobile").removeClass('object_ok'); // if necessary
$("#mobile").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
}
else
{
$("#mstatus").html('<font color="red">The Mobile should have at least <strong>10</strong> characters.</font>');
$("#mobile").removeClass('object_ok'); // if necessary
$("#mobile").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$("#proposedby").change(function()
{
var pisa = $("#proposedby").val();
if(pisa.length >= 4)
{
$("#proposedby_status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "pcheck.php",
data: "proposedby="+ pisa,
success: function(msg)
{
$("#proposedby_status").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#proposedby").removeClass('object_error'); // if necessary
$("#proposedby").addClass("object_ok");
$(this).html(' ');
flagepropesed=true;
}
else
{
$("#proposedby").removeClass('object_ok'); // if necessary
$("#proposedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
$(this).html(msg);
}
});
}
});
}
else
{
$("#proposedby_status").html('<font color="red">The Proposed by ISA No should have at least <strong>4</strong> characters.</font>');
$("#proposedby").removeClass('object_ok'); // if necessary
$("#proposedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$("#secondedby").change(function()
{
var sisa = $("#secondedby").val();
if(sisa.length >= 4)
{
$("#secondedby_status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "scheck.php",
data: "secondedby="+ sisa,
success: function(msg)
{
$("#secondedby_status").ajaxComplete(function(event, request, settings)
{
if(msg == 'OK')
{
$("#secondedby").removeClass('object_error'); // if necessary
$("#secondedby").addClass("object_ok");
$(this).html(' ');
flagesecondby=true;
}
else
{
$("#secondedby").removeClass('object_ok'); // if necessary
$("#secondedby").addClass("object_error");
$(this).html(msg);
$('#submit').attr('disabled', 'disabled');
}
});
}
});
}
else
{
$("#secondedby_status").html('<font color="red">The Seconded by ISA No should have at least <strong>4</strong> characters.</font>');
$("#secondedby").removeClass('object_ok'); // if necessary
$("#secondedby").addClass("object_error");
$('#submit').attr('disabled', 'disabled');
}
});
$('#submit').attr('disabled', 'disabled');
// Check This If all Flags are true then remove
if(flagemail==true && flagemobile==true && flagepropesed==true && flagesecondby == true)
{
$('#submit').removeAttr('disabled');
}
});
-->
</script>
<center>
<div align="center">
<h2 align="center">AJAX Username Verification</h2>
<form action="#" method="post">
<table width="700" border="0">
<tr>
<td width="200"><div align="right">Email-Id: </div></td>
<td width="100"><input type="email" id="email" name="email" pattern="^[a-zA-Z0-9-\_.]+@[a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,3}$" /></td>
<td width="400" align="left"><div id="status"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Mobile: </div></td>
<td width="100"><input type="text" name="mobile" id="mobile" pattern="^[0-9-]+" maxlength="10" /></td>
<td width="400" align="left"><div id="mstatus"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Proposed By (Isa no): </div></td>
<td width="100"><input type="text" name="proposedby" id="proposedby" /></td>
<td width="400" align="left"><div id="proposedby_status"></div></td>
</tr>
<tr>
<td width="200"><div align="right">Seconded By (Isa no): </div></td>
<td width="100"><input type="text" name="secondedby" id="secondedby" /></td>
<td width="400" align="left"><div id="secondedby_status"></div></td>
</tr>
<tr>
<td colspan="3"><input type="submit" name="submit" id="submit" value="submit" /></td>
</tr>
</table>
</form>
</div>
</center>
试试这可能会对你有所帮助
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？