我正在嘗試使用 Javascript 來驗證輸入欄位是否具有以下特定格式：
- “字 1，字 2”
所以兩個詞之間必須有逗號，不能有空格。WORD1 可以是任何單詞，但 WORD2 必須是以下串列中的單詞：
- “USD”、“AUD”、“BTC”、“CAD”、“CHF”、“EUR”、“GBP”、“ETH”、“JPY”、“NZD”
如果輸入欄位沒有 WORD2 中的任何單詞，則驗證將失敗。例如：“ASDA,USD”將被視為有效且沒有問題。但是，“ASDA,ASD”將被視為無效。
我該如何進行編程？這是我到目前為止的大寫驗證。
Javascript
function cryptoValidate() {
var cryptoBaseCurrencies = ("USD", "AUD", "BTC", "CAD", "CHF", "EUR", "GBP", "ETH", "JPY", "NZD");
let x = document.getElementById("inputText4").value;
let text;
if (x.toUpperCase() != x) {
document.getElementById('demo2').style.display = "block";
text = "Crypto and base must be uppercase";
document.getElementById("inputText4").value = '';
}
else if WORD FORMATTING HERE {
document.getElementById('demo2').style.display = "block";
text = "Missing the correct base currency"
document.getElementById("inputText4").value = '';
}
else {
text = "Input OK";
document.getElementById('demo2').style.display = "none";
}
document.getElementById("demo2").innerHTML = text;
}
HTML
<div class="col-auto">
<input type="text" id="inputText4" class="form-control" aria-describedby="TextHelpInline" placeholder="e.g. BTC,USD"/>
</div>
<div class="col-auto">
<button id="inputTextBtn4" class="btn set-btn" onclick="cryptoValidate()">Add</button>
</div>
<p id="demo2" style="display: none"></p>
uj5u.com熱心網友回復：
使用選擇
（修改代碼以允許任何文本前綴）
選擇通常用于將選項限制為一組定義的值。這避免了決議和驗證用戶輸入的不必要的復雜性。因此，在此解決方案中，“word2”已被制作為<select>帶有貨幣縮寫串列。
文本前綴或“word1”是具有模式屬性的輸入。該模式允許 1-5 個字母不帶空格，但這可以根據需要進行修改。用戶輸入通過代碼使用checkValidity進行驗證，然后轉換為大寫。
驗證后，代碼回傳一個字串：word1,word2
rate.addEventListener("change", e => {
let el = rate.querySelector("input");
if (el.checkValidity()) {
let word1 = el.value.toUpperCase();
let word2 = rate.querySelector("option:checked").value;
console.log("You selected: ", word1 "," word2);
// do something
}
else {
console.log("Invalid input");
}
});body {
font-family: sans-serif;
padding: 1em;
}
#rate input:invalid ~ span:after {
content: "Please enter 1-5 characters without spaces";
color: red;
display: block;
font-size: 0.8rem;
}<span id="rate">
<input type="text" pattern="[A-Za-z]{1,5}" spellcheck=false placeholder="enter prefix">
<select>
<option>USD</option>
<option>AUD</option>
<option>BTC</option>
<option>CAD</option>
<option>CHF</option>
<option>EUR</option>
<option selected>GBP</option>
<option>ETH</option>
<option>JPY</option>
<option>NZD</option>
</select>
<span></span>
</span>uj5u.com熱心網友回復：
而不是在非常高的層次上使用 javascript；在基本級別使用正則運算式。
正則運算式用于匹配字串和驗證。
讓我解釋一下我創建的正則運算式
let regex = /([a-zA-Z] ),(USD|AUD|BTC|CAD|CHF|EUR|GBP|ETH|JPY|NZD|)$/;
()代表分組
[a-zA-Z]代表任何字母（大寫或小寫）
代表多個
|代表替代
let regex = /([a-zA-Z] ),(USD|AUD|BTC|CAD|CHF|EUR|GBP|ETH|JPY|NZD|)$/;
let str = "Iamanexamplestring,BTC"; //
let result = regex.test(str);
if(result) {
console.log("??");
} else {
console.log("??");
}轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/476486.html
標籤：javascript html css 形式 验证