第十天学习@javascript
问题：
使用SQL Server时，当表已经建好，要再修改表结构时，就会提示不能修改？
工具->选项->阻止保存要求重新创建表的更改
把打钩去掉即可。
问题：
JavaScript 表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
被 JavaScript 验证的这些典型的表单数据有：
- 用户是否已填写表单中的必填项目？
- 用户输入的邮件地址是否合法？
- 用户是否已输入合法的日期？
- 用户是否在数据域 (numeric field) 中输入了文本？
必填（或必选）项目
下面的函数用来检查用户是否已填写表单中的必填（或必选）项目。假如必填或必选项为空，那么警告框会弹出，并且函数的返回值为 false，否则函数的返回值则为 true（意味着数据没有问题）：
下面是连同 HTML 表单的代码：
<html>
<head>
<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(email,"Email must be filled out!")==false)
{email.focus();return false}
}
}
</script>
</head>
<body>
<form action="submitpage.htm" onsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
E-mail 验证
下面的函数检查输入的数据是否符合电子邮件地址的基本语法。
意思就是说，输入的数据必须包含 @ 符号和点号(.)。同时，@ 不可以是邮件地址的首字符，并且 @ 之后需有至少一个点号：
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}
下面是连同 HTML 表单的完整代码：
<html>
<head>
<script type="text/javascript">
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Not a valid e-mail address!")==false)
{email.focus();return false}
}
}
</script>
</head>
<body>
<form action="submitpage.htm"onsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
问题：
JavaScript 动画
使用 JavaScript 创建动态图像是可行的。
窍门是：使用 JavaScript 通过不同的事件来切换不同的图像。
在下面的例子中，我们要制作一个充当链接按钮的图像。我们将使用 onMouseOver 事件和 onMouseOut 事件来驱动 JavaScript 函数切换图像。
完整的代码：
<html>
<head>
<script type="text/javascript">
function mouseOver()
{
document.b1.src ="/i/eg_mouse.jpg"
}
function mouseOut()
{
document.b1.src ="/i/eg_mouse2.jpg"
}
</script>
</head>
<body>
<a href="http://www.w3school.com.cn" target="_blank">
<img border="0" alt="Visit W3School!" src="/i/eg_mouse2.jpg" name="b1"
onmouseOver="mouseOver()"onmouseOut="mouseOut()" /></a>
</body>
</html>
问题：
HTML <a> target Attribute
Example
The target attribute specifies where to open the linked document:
<a href="http://www.w3schools.com" target="_blank">Visit W3Schools</a>
Browser Support
The target attribute is supported in all major browsers.
Definition and Usage
The target attribute specifies where to open the linked document.
Syntax
<a target="_blank|_self|_parent|_top|framename">
Attribute Values
| Value |
Description |
| _blank |
Opens the linked document in a new window or tab |
| _self |
Opens the linked document in the same frame as it was clicked (this is default) |
| _parent |
Opens the linked document in the parent frame |
| _top |
Opens the linked document in the full body of the window |
| framename |
Opens the linked document in a named frame |
问题：
JavaScript 计时事件
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的，两个关键方法是:
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()
实例
下面的例子和上面的无穷循环的例子相似。唯一的不同是，现在我们添加了一个 "Stop Count!" 按钮来停止这个计数器：
<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
function stopCount()
{
clearTimeout(t)
}
</script>
</head>
<body>
<form>
<input type="button" value="Start count!" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="Stop count!" onClick="stopCount()">
</form>
</body>
</html>
问题：
什么是DHTML？
DHTML是Dynamic HTML的简称，就是动态的html，是相对传统的静态的html而言的一种制作网页的概念。所谓动态HTML(Dynamic HTML，简称DHTML)，其实并不是一门新的语言，它只是HTML、CSS和客户端脚本的一种集成，即一个页面中包括html+css+javascript(或其它客户端脚本)，其中css和客户端脚本是直接在页面上写而不是链接上相关文件。DHTML不是一种技术、标准或规范，只是一种将目前已有的网页技术、语言标准整合运用，制作出能在下载后仍然能实时变换页面元素效果的网页设计概念。
问题：
jQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
jQuery 很容易学习。
问题：
路径特殊符号
以下为建立路径所使用的几个特殊符号，及其所代表的意义。
"." -- 代表目前所在的目录，相对路径。 如：<a href="./abc">文本</a> 或 <img src="./abc" />
".." -- 代表上一层目录，相对路径。 如：<a href="../abc">文本</a> 或 <img src="../abc" />
"http://www.cnblogs.com/" -- 代表的是上一层目录的上一层目录，相对路径。 如：<img src="http://www.cnblogs.com/abc" />
"/" -- 代表根目录,绝对路径。 如：<a href="/abc">文本</a> 或 <img src="/abc" />
"D:/abc/" -- 代表根目录,绝对路径。
问题：
历史
大概在1992年，一家称作Nombas的公司开始开发一种叫做C减减（C-minus-minus，简称 Cmm）的嵌入式脚本语言。这个脚本语言捆绑在一个叫做CEnvi的共享软件产品中，当Netscape Navigator崭露头角时，Nombas开发了一个可以嵌入网页中的CEnvi的版本。这些早期的试验称为EspressoPage（浓咖啡般的页面），它们代表了第一个在万维网上使用的客户端脚本语言。而Nombas丝毫没有料到它的理念将会成为因特网的一块重要基石。
问题：
超链接的代码
<a href="http://www.divcss5.com/" target="_blank" title="关于div css的网站">DIV+CSS</a>
解析如下：
href 后跟被链接地址目标网站地址这里是http://www.divcss5.com/
target
_blank -- 在新窗口中打开链接
_parent -- 在父窗体中打开链接
_self -- 在当前窗体打开链接,此为默认值
_top -- 在当前窗体打开链接，并替换当前的整个窗体(框架页)
title 后跟链接目标说明，也就是超链接被链接网址情况简要说明，或标题
CSS可控制超链接样式-css链接样式如下
a:active是超级链接的初始状态
a:hover是把鼠标放上去时的状况
a:link 是鼠标点击时
a:visited是访问过后的情况
问题：
id 选择器以 "#" 来定义，命名CSS选择器。
定义命名css id选择器例子：
#yangshi1{color:#F00;}定义红色www.divcss5.com实例
#yangshi2{color:#0F0;}定义绿色
对应html中div引用
<div id="yangshi1">我颜色为红色</div>
<div id="yangshi2">我颜色为绿色</div>
CSS class知识：
与CSS ID不同特性是clsss类可以在一个网页内无限次引用。
一个div标签的定义只能使用一个id如：
<div id="yangshi1" id="yangshi2">www.divcss5测试内容</div>
或
<div id="yangshi1 yangshi2">www.divcss5测试内容</div>
两个都是不正确的，并且CSS样式属性也不能生效- 成为CSS 失效之一。
对应html中div+css引用：
<div class="yangshi1">我颜色为红色</div>
<div class="yangshi2">www.divcss5.com我字体大小为28px</div>
<div class="yangshi1 yangshi2">我颜色为红色文字大小为28px</div>
以上即是“yangshi1”“yangshi2”类的正确使用方法
一个div标签内运用id和class是可以的：
.yangshi1{... ...}
#yangshi2{... ...}
.yangshi3{... ...}
<div class="yangshi1" id="yangshi2">这样是可以的也是正确的.
<div class="yangshi1 yangshi3" id="yangshi2">同样是正确的可取的。
问题：
CSS代码优化地方：
1、border(CSS边框)简写：
border-top:1px solid #000;border-bottom:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;
可以简写为：border:1px solid #000;
2、padding（CSS padding）简写：
padding-top:1px;padding-right:2px;padding-bottom:3px;padding-left:4px;
可简写为：padding:1px 2px 3px 4px;
padding-top:1px;padding-right:1px;padding-bottom:1px;padding-left:1px;
可简写为：padding:1px;
3、margin简写
margin-top:1px;margin-right:2px;margin-bottom:3px;margin-left:4px;
可简写为：margin:1px 2px 3px 4px;
margin-top:1px;margin-right:1px;margin-bottom:1px;margin-left:1px;
可简写为：margin:1px;
4、background简写
background-color:#000;可以简写为background:#000;
background-image:url(图片地址)
可简写为：background:url(图片地址)
5、font简写
font-size:12px; line-height:12px; font-family:Arial, Helvetica, sans-serif;
可简写为：font:12px/12px Arial, Helvetica, sans-serif;
问题：
CSS重用优化
这里主要介绍是CSS代码的共用属性提取来达到节约代码、维护方便，CSS实例如下：
.yangshi_a{ width:100px; height:20px; text-align:left; float:left; font-size:24px;}
.yangshi_b{ width:100px; height:20px; text-align:right; float:left; font-size:24px;}
他们都有相同高度、宽度、浮动、文字大小，而只有内容居左居右不同(你可能需要了解CSS居中)，我们就可以提取他们相同属性
优化后:
.yangshi_a ,.yangshi_b{ width:100px; height:20px; text-align:left; float:left; font-size:24px;}
.yangshi_b{text-align:right; }
问题：
mvc 路由规则
ASP.NET MVC是由路由引擎来处理url，并且映射到对应的Controller里的方法也就是Action
举个例子输入url http://localhost/Product/List
1. mvc路由引擎首先分离出url中的路径也就是/Product/List
2. 然后在路由映射表设置里（在global.asax里）寻找向应的路由规则，一般都是用默认的也就是/controller/action这种格式， 除非特别设置
3. 按照路由规则把径/Product/List分离找出对应的controller: Product和action: List
4. 最后再执行controller文件夹里ProductController.cs里的List() 方法
5. 在List()执行完毕 会return View(); 这里默认的view就是 \view\product\list.aspx 这个文件 ASP.NET MVC 用到了很多convention over configuration就是用默认的规则替代了很多配置文件
例如你输入URL /Product/List 系统就会假设在CONTROLLER文件夹里里有一个ProductController.cs文件，这个文件里有一个List()方法， 另外在\View\Product文件夹里有一个List.aspx文件,也就是VIEW
这里要说一下List.aspx这个文件虽然是存在的，但是你要直接访问http://localhost/view/product/list.aspx会显示错误信息的， 因为路由引擎屏蔽了直接访问这个文件夹。 要通过/controller/action 这种格式来访问对应的VIEW