jQuery表单事件

<input type="text" class="field" value="文本框" />
<textarea name="words" class="field" cols="30" rows="10"></textarea>
<select name="age" class="field">
    <option value="1">15</option>
    <option value="2">22</option>
    <option value="3">28</option>
</select>

focus()当元素获得焦点时触发，比如鼠标点击选中元素或tab键定位到元素时，该元素就会获得焦点。
focus()方法触发focus事件，或当发生focus事件时运行的函数。

$(".field").focus(function() {
        $(this).css({
            'background': '#f90',
            'border': '1px solid #999'
        });
    })

focusin()事件在元素（或内部的任何元素）获得焦点时触发。它和focus()的区别是，focusin()可以在父元素上检测子元素获得焦点的情况(换而言之，它支持事件冒泡)。

<p>
    <input type="text" value="focusin" />
    <span>focusin</span>
</p>
<script>
$(function() {
    $("p").focusin(function() {
        $(this).find("span").css('display', 'inline').fadeOut(1000);
    })
})
</script>

blur()当元素失去焦点时触发，仅发生于表单上。

$(".field").blur(function() {
        $(this).css({
            'background': '#f90',
            'border': '1px solid #999'
        });
    })

2个表单元素，1个用来输入内容，另外一个同步的显示输入的内容。

keyup()方法

完整的key press过程分为两步：一是按下按键，二十按键被松开并复位。
当按钮呗松开的时候触发keyup事件。它发生在当前发生的焦点元素上。

<input type="text" value="" id="value1" /><br />
<input type="text" value="" id="value2" />
<script>
    $("#value1").keyup(function() {
        var value = $(this).val();
        $("#value2").val(value);
    })
</script>

change()方法
当输入域发生变化时触发change事件。
仅适用于text textarea select元素，当用于select元素时，选择某个选项时触发chagne事件，当用于text和textarea元素时，在元素失去焦点的时候触发change事件。

$(".field").change(function() {
        $(this).css({
            'background': '#f90',
            'border': '1px solid #999'
        });
    })

select()方法
当text或textarea域的input元素中的文本被选择时，会发生select事件

$(".field").select(function() {
        $(this).css({
            'background': '#f90',
            'border': '1px solid #999'
        });
    })

submit()方法
当表单提交时，触发submit事件，只适用于表单。
阻止提交按钮的默认action。 使用preventDefault()函数来阻止对表单的提交;

$("form").submit(function(e) {
        e.preventDefault();
        alert("Submit");
    })