問題出現的原因：在提交表單的時候經常會需要判斷表單內的內容是否合法，這時候就需要處理提交按鈕點選事件與表單action屬性的關係，

問題體現：無論表單內的內容是否合法，都會跳轉到action繫結的地址。

解決辦法：

一：用form表單的onsubmit方法添進行呼叫，不再使用按鈕繫結事件。在表單進行提交時會先執行onsubmit()方法，然後根據返回值判斷是否提交，只有在返回值為false的情況下不進行提交。程式碼如下：

<form action="xxxx.html"method="get" id="form1"onsubmit="return yy();">
    <fieldset>
        <legend class="clol">請輸入預留資訊</legend>
        <div>
            <label>預留姓名：<input  class="clol" id="name1" type="text" name="name" size="30" maxlength="100" /></label>
            <br />
            <label >預留手機號：<input class="clol" id="phone1" type="text" name="phone" size="30" maxlength="100"/></label>
            <br />
        </div>
     </fieldset>
    <button class="layui-btn-lg" type="submit" id = "submit">查詢</button>
</form>

<script type="text/javascript">
var loginNmae1 = 0;
var loginphone1 = 0;
$("#name1").mouseleave(function(){
    var  loginName = $("#name1").val();
    if ( loginName =="") {alert('使用者名稱不能為空！');}
    else {
        loginNmae1 =1;
    }
})
$("#phone1").mouseleave(function(){
    var loginphone = $("#phone1").val();
    if (loginphone ==""||loginphone.length!=11 || isNaN(Number(loginphone))){alert('手機號不正確，請重新輸入');}
    else {loginphone1 = 1;}
})
function yy(){
    if(loginNmae1 == 1&&loginphone1 ==1) {
        document.getElementById('form1').submit();
        return true;
    }else{
        alert("手機號或姓名錯誤，請重新輸入");
        window.location.href="yuyue.html";
        return false;
    }
}
</script>
 

二：利用先進行按鈕繫結事件的判定，再驗證成功的情況下再進行表單提交

<form action="xxxxxx.html" method="get" id="form1">
    <fieldset>
        <legend>請輸入預留資訊</legend>
        <div>
            <label>預留姓名：<input id="name1" type="text" name="name" size="30" maxlength="100" /></label>
            <br />
            <label>預留手機號：<input id="phone1" type="text" name="phone" size="30" maxlength="100"/></label>
            <br />
        </div>
    </fieldset>
    <button type="submit" id = "submit" onclick="tijiao">提交</button>
</form>
<srcipt type="text/javascript">
var loginNmae1 = 0;
var loginphone1 = 0;
$("#name1").mouseleave(function(){
    var  loginName = $("#name1").val();
    if ( loginName ==""){
       alert('使用者名稱不能為空！');
    }else {
         loginNmae1 =1;
    }
})
$("#phone1").mouseleave(function(){
    var loginphone = $("#phone1").val();
    if (loginphone ==""||loginphone.length!=11 || isNaN(Number(loginphone))){alert('手機號不正確，請重新輸入');}
    else {loginphone1 = 1;}
})
function tijiao(){
    if(loginNmae1 == 1&&loginphone1 ==1) {
       document.getElementById('form1').submit(); //驗證成功進行表單提交
    }else{
        alert("手機號或姓名錯誤，請重新輸入");
    }
}
</script>