首頁猿問 checkvalidity...

checkvalidity 總是為必填字段返回 true

JavaScript

智慧大石 2021-10-29 15:54:03

我有一個輸入字段和一個按鈕。單擊按鈕時，我想調用 HTML 樣式字段驗證錯誤消息。由于這個原因，我將輸入和字段包裝在一個表單中。 <form id="frmShippingHeader"> <input name="trailerNumber" id="trailerNumber" class="form-control fireChange" type="text" aria-describedby="enter Part Number" placeholder="Trailer Number" required> <button class="btn btn-success" id="btnCreateShipping" onClick="createShippingOrder()">Create Shipping Order</button> </form>使用我的 javascript 我想檢查表單是否有效或無效。如果表單有效，我會阻止默認，并且不需要錯誤消息。但是，如果表單無效，我不想阻止默認。但是，即使我將輸入字段留空并單擊按鈕，也會blnFormValidity返回 true$("#btnCreateShipping").click(function(e){ blnFormValidity= $('#frmShippingHeader')[0].checkValidity() console.log(blnFromValidity) if(blnFormValidity==true){ e.preventDefault(); return false }})

查看完整描述

3 回答

侃侃無極

TA貢獻2051條經驗獲得超10個贊

你這里有拼寫錯誤

blnFormValidity= $('#frmShippingHeader')[0].checkValidity()

console.log(blnFromValidity)

blnFromValidity is different than blnFormValidity

除此之外，您可以使用 jquery 驗證插件進行驗證。jQuery 驗證

然后你可以直接檢查表單驗證

$("#btnCreateShipping").click(function(e){

console.log($("#frmShippingHeader").validate());

})

這很容易，并且可以為您提供更多功能。希望有幫助

反對回復 2021-10-29

一只斗牛犬

TA貢獻1784條經驗獲得超2個贊

更正您現有的代碼：正如每個人為您的變量提到的那樣，這只是拼寫錯誤。所以只要糾正那件事就行了。

另外：在您的 html 表單中，您正在調用onclick事件的方法，請記住，如果您在方法上沒有任何特別的事情要做createShippingOrder(...)，請將其刪除，否則您可能無法按事件綁定click和調用的順序獲得所需的結果方法onclick會導致您出現問題，例如以意外的順序發生事情。要解決這個問題，您可以在方法中收集點擊事件的功能，反之亦然。檢查您更正的代碼-jsFiddle。

您還可以使用 JQuery 表單驗證器，它非常方便，如下所示：

<button type="button" class="btn btn-success" id="btnCreateShipping" >Create Shipping Order</button>

</form>

JQuery 表單驗證：

$("#frmShippingHeader").validate({

rules: {

trailerNumber:

{

required: true,

number:true

messages: {

trailerNumber:

{

required: "Please trailer number",

number:"Must be a number"

}

});

反對回復 2021-10-29

紫衣仙女

TA貢獻1839條經驗獲得超15個贊

這對我有用并打印 true

$("#btnCreateShipping").click(function(e){

const blnFormValidity= $('#frmShippingHeader')[0].checkValidity();

console.log(blnFormValidity);

if(blnFormValidity === true){

e.preventDefault();

return false

}

});

function createShippingOrder () {

alert('working')

}

如果你想寫 100% 有效的代碼，使用webstorm

反對回復 2021-10-29

3 回答
0 關注
284 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

checkvalidity 總是為必填字段返回 true

checkvalidity 總是為必填字段返回 true

3 回答

添加回答