jquery如何獲取對應表單元素?

問題描述：我頁面中有這樣多個表單，我都是這個定義的，當我點擊確定按鈕時，此時能夠獲得相對應的表單對象，我該怎么獲取到他的兩個值呢？

解決方案：

 頁面元素

<form id="form1">
    <lable>姓名:</lable>
    <input type="text" class="user_name">
    <lable>電話:</lable>
    <input type="text" class="user_tel">
    <span class="button">確定</span>
</form>
<form id="form2">
    <lable>姓名:</lable>
    <input type="text" class="user_name">
    <lable>電話:</lable>
    <input type="text" class="user_tel">
    <span class="button">確定</span>
</form>
<form id="form3">
    <lable>姓名:</lable>
    <input type="text" class="user_name">
    <lable>電話:</lable>
    <input type="text" class="user_tel">
    <span class="button">確定</span>
</form>

jquery實現方法(自己任意添加一個jquery庫即可)

$(function(){
     $('.button').each(function(){
        $(this).click(function(){
            var name = $(this).parent('form').find('.user_name').val();
            var tel = $(this).parent('form').find('.user_tel').val();
            console.log(name);
            console.log(tel);
        });
     });
})