jQuery没有隐藏元素
jQuery not hiding elements
这是我的代码,我要做的是让javascript检查表单,然后通过AJAX将其提交给PHP脚本,让用户登录。
<!DOCTYPE html>
<html>
<head>
<title>RPEMS: Login</title>
<link rel="stylesheet" type="text/css" href="../main.css"></link>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type='text/javacript'>
$(function()
{
$('.error').hide();
$('.button').click(function()
{
$('.error').hide();
var filter=/^(['w-]+(?:'.['w-]+)*)@((?:['w-]+'.)*'w['w-]{0,66})'.([a-z]{2,6}(?:'.[a-z]{2})?)$/i;
var email = $('input#email').val();
var pass = $('input#pass').val();
var err = false;
if (!email)
{
$('label#emErr').show();
$('input#email').focus();
err = true;
}
if (!filter.test(email))
{
$('label#emValErr').show();
$('input#email').focus();
err = true;
}
if (!pass)
{
$('label#passErr').show();
$('input#pass').focus();
err = true;
}
if (err) return false;
var dataString = 'email=' + email + '&pass=' + pass;
$.ajax({
type: "POST",
url: "log.php",
data: dataString,
success: function(result)
{
if (result.success == true) window.location('../');
else $('p#phpErr).html(result.message).show();
}});
}
});
</script>
</head>
<body>
<div id="header">
<img id="logo" src="../img/logo.png"></img>
<ul id="navBar">
<li class="navLink">
<a href="/">Home</a>
</li>
<li class="navLink">
<a href="/about">About/Contact Us</a>
</li>
<li class="navLink">
<a href="/calendar">Calendar</a>
</li>
<li class="navLink">
<a href="/login">Login</a>
</li>
</ul>
</div>
<form method='post' action=''>
<fieldset>
<label for='email'>Email: </label>
<input name='email' id='email' type='text'></input>
<br class='error'></br>
<label for='email' class='error' id='emErr'>This field is required</label>
<label for='email' class='error' id='emValErr'>Invalid email adress</label>
<br class='error'></br>
<label for='pass'>Password: </label>
<input name='pass' id='pass' type='password'></input>
<br></br>
<label for='pass' class='error' id='passErr'>This field is required</label>
<br class='error'></br>
<p class='error' id='phpErr'></p>
<input type='submit' name='submit' id='submit_btn' value='Submit'></input>
</fieldset>
</form>
遗憾的是,当我加载页面时,错误并没有被隐藏,你知道为什么吗?
您的代码中有一个Uncaught SyntaxError: Unexpected token )
。请确保您始终在浏览器中检查控制台。参见jsfiddle
这是你的工作小提琴。您的行else $('p#phpErr').html(result.message).show();
中缺少一个报价,文档前缺少一个结束);
。准备
请始终检查您的控制台,因为这将帮助您解决此类错误。。。如果你不知道如何使用控制台。查看
您的脚本有非法的MIME-type
(缺少s
)
<script type='text/javacript'>
这就是为什么浏览器甚至不尝试执行它
更改为正确的type="text/javascript"
此外,在脚本的最后几行有几个语法错误,请修复:
else $('p#phpErr').html(result.message).show(); //missing quote here
}});
}); //missing ) here
});
相关文章:
- 切换一个元素并将其余元素隐藏在同一包装类下
- CSS 动画在元素隐藏时暂停
- 检查元素是否可见,父元素隐藏在DOM中
- 粘性导航元素 - 隐藏然后显示
- show() 在元素隐藏时不起作用
- 通过可见性隐藏和显示元素:隐藏/可见
- 如何从检查页面元素隐藏Blogger中的javascript代码
- 基于页面元素隐藏部分html代码
- 使用jQuery和select元素隐藏动态类
- Jquery Div元素隐藏
- 当指针在父元素上时,Boostrap工具提示会在父元素隐藏之前触发悬停事件
- 聚焦元素隐藏在固定菜单后面
- 将jQuery中的元素隐藏在表中
- 元素.隐藏变量可移植性
- 如何使一个元素隐藏在向下滚动的wordpress
- 当父元素隐藏时,如何使用jquery show()
- 高度:自动计算错误,如果元素隐藏时dom加载,然后显示
- Javascript元素隐藏不起作用
- 使元素隐藏后直接显示完成jquery
- HTML表单元素隐藏的onload javascript