解决方案在最后
实现功能:单击发送注册码按钮,异步将输入的邮箱发送到后台,实现邮箱认证功能
问题描述:在script中使用ajax向后台传递输入的邮箱时,发现js中通过id获取的是 [object htmlinputelement]
html in
<!--==========================邮箱============================================-->
<div class="form-style-agile">
<i class="fas fa-user"></i>
邮箱(Email)
</label>
<input placeholder="邮箱(Email)" name="email" id="_email" value="" type="text"required>
<div id="show_state">
<button class="div" onclick="sendEmail('show_state')">发送注册码</button>
</div><%--div容器,显示服务页返回的内容 --%>
</div>
script in
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url,cfunc)
{
if ()
{// IE7+, Firefox, Chrome, Opera, Safari 代码
xmlhttp=new XMLHttpRequest();
}
else
{// IE6, IE5 代码
xmlhttp=new ActiveXObject("");
}
=cfunc;
("POST",url,true);
();
}
function sendEmail(divID_show){
//divID_show:展示后台返回信息的容器
var _email=("_email");
var URL="checkEmail_servlet.jsp?email=";
("邮箱是"+_email);
("接受容器"+divID_show);
alert("开始执行js,后台正在尝试发送邮件给"+_email);
URL=URL+_email.value;//在地址中添加变量,用超链接传值
alert(URL);
loadXMLDoc(URL,function()
{
alert("提示信息!"++","+ );//调试,查看xmlhttp的状态值,用于判断错误类型
if (==4 && ==200)
{
(divID_show).innerHTML=;
alert("发送成功,请查收!");
}
});
}
</script>
出现问题:
原因分析:十分的粗心,在获取输入框的值的时候没有添加value属性,导致获取的一个DOM节点,最后输出在浏览器上面显示的即为HTMLInputElement,不是实际的输入值
即:
var _email=document.getElementById("_email");
alert("开始执行js,后台正在尝试发送邮件给"+_email);
解决方案:添加value属性
即:
var _email=("_email");
alert("开始执行js,后台正在尝试发送邮件给"+_email.value);