jQueryEvent的form表单事件

           jQueryEvent的form表单事件

form表单事件，通过form标签括住，就叫做form表单。对于这个form表单，首先就要了解一下form表单里面的action、method两个属性。Form表单之所以能够提交网页action、method两个属性关键的。

action 表单数据会提交到名为 “/xxxxxx /xxxxxxxx” 的页面

method 表单数据将通过 method 属性附加到 URL 上：

method的值一般“get” 、“post”，所以说method是决定form表单提交数据的方式。Method 和action都是两个结合使用。

action 属性规定当提交表单时，向何处发送表单数据。语法：。URL有两种绝对、相对。 绝对 URL - 指向其他站点（比如
src=“www.example.com/example.htm”），相对 URL - 指向站点内的文件（比如 src=“example.htm”），页面与页面之间提交数据都是使用相对URL。

jQuery表单事件之change事件

的值和元素的值都是可以发生改变的，我们可以使用change事件去监听这些动作。

Input标签：监听value值的变化，当有改变时，失去焦点后触发change事件。对于radio单选按钮和复选框，当用户用鼠标做出选择时，该事件立即触发。

Select标签：对于下拉选择框，当用户用鼠标作出选择时，该事件立即触发

Textarea标签： 多行文本输入框，当有改变时，失去焦点后触发change事件

具体是怎么使用？代码如下：

            <label for="target1">文本input:</label>

            <input type="text" class="form-control" id="target1" >

        </div><div class="form-group">

            <label for="target3">大文本textarea:</label>

            <textarea class="form-control" rows="5" id="target3"></textarea>

        </div>

            <button class="btn btn-primary" id="btnSubmit">表单提交</button>

        </div>

 $("#target1").change(function (e) {

        console.log(e);

       
 $("#result").html(e.target.value);

   
});

获取到#target1，触发changa事件。触发changa事件就会返回回调函数，注意：之所以会用e来接收，是因为e为事件对象 事件对象是用来记录一些事件发生时的相关信息的对象。事件对象只有事件发生时才会产生，并且只能是事件处理函数内部访问，在所有事件处理函数运行结束后，事件对象就被销毁,特别好用。

jQuery表单事件之submit事件

提交表单是一个最常见的业务需求，比如用户注册，一些信息的输入都是需要表单的提交。同样的有时候开发者需要在表单提交的时候过滤一些的数据、做一些必要的操作（例如：验证表单输入的正确性，如果错误就阻止提交，从新输入）此时可以通过submit事件，监听下提交表单的这个动作

使用方法与基本参数处理保持一致，不过需要注意的是form标签会有默认提交表单的行为。要是通过submit处理的话，需要禁止这默认体提交的功能：

//禁止浏览器的默认提交行为

    $("#btnSubmit").submit(function () {

        return false;

    });

jQuery表单事件之select事件

当 textarea 或文本类型的 input 元素中的文本被选择时，会发生 select 事件。 这个函数会调用执行绑定到select事件的所有函数，包括浏览器的默认行为。可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。

select事件只能用于元素与元素，代码示例：

//input
元素中的文本被选择时触发

    $("input").select(function () {

        alert("input标签的文本被选中事件");

    });

//textarea元素中的文本被选择时触发

    $("textarea").select(function () {

        alert("textarea标签的文本被选中事件");

    });