我知道这很难理解,但请试一试。看一下屏幕截图。
小输入框的名称是murl
。
add()
用于提交表单。如果murl
为空,则必须直接提交表单,如果它不为空,则murl
必须根据数据库检查条目是否存在。如果它不存在add()
被调用。
问题是button
必须单击两次才能触发该功能。
按钮上的代码是:
<button type="button" value="My button value" onclick="javascript: niju();" name="microsubmit" id="microsubmit">button</button>
该按钮调用的 JavaScript 是:
function niju()
{
var flag=1;
var micro=document.getElementById('murl').value;
$('#microsubmit').click(function()
{
if(micro=="")
{
add();
}
else
{
//remove all the class add the messagebox classes and start fading
$("#msgbox")
.removeClass()
.addClass('messagebox')
.text('Checking...')
.fadeIn("slow");
//check the username exists or not from ajax
$.post("<?php echo SITE_ROOT;?>inc/user_availability.php",
{ murl: $("input:murl").val() },
function(data)
{
if(data=='no') //if username not avaiable
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
//add message and change the class of the box and start fading
$(this)
.html('This User name Already exists')
.addClass('messageboxerror')
.fadeTo(900,1);
flag=0;
});
}
else
{
$("#msgbox")
//start fading the messagebox
.fadeTo(200,0.1,function()
{
//add message and change the class of the box and start fading
$(this)
.html('Username available to register')
.addClass('messageboxok')
.fadeTo(900,1);
flag=1;
add();
});
}
});
}
});
if(micro=="" && flag==1)
{
add();
}
}
截屏: