1

我正在尝试在网页上创建单个文本框表单来布尔测试用户提交的输入。输入将是网站用户的邮政编码。我想制作一个预先确定的邮政编码数组，以测试为真。

如果为真（输入的邮政编码包含在预定数组中），我想显示一位 HTML，如果测试为假，我想显示另一位。

我四处寻找并查看了我的一些 JavaScript 书籍（我刚刚开始学习），但没有找到答案；有人可以帮我解决这个问题吗？谢谢！

4

2 回答 2

2

HTML：

<label id="input-label" class="invalid">
    ZIP code: <input id="zipcode" />
    <div class="valid-message">
        Valid
    </div>
    <div class="invalid-message">
        Invalid
    </div>
</label>

CSS：

#input-label.valid .valid-message { display: block; }
#input-label.valid .invalid-message { display: none; }

#input-label.invalid .valid-message { display: none; }
#input-label.invalid .invalid-message { display: block; }

Javascript

function isValidZip(z) {
    return ['12345','67890'].indexOf(z) != -1;
}

var label = document.getElementById('input-label');
var input = document.getElementById('zipcode');

input.onkeydown = function() {
    label.className = isValidZip(input.value) ? "valid" : "invalid";
}
于 2012-10-08T19:28:16.810 回答
0

你可以尝试这样的事情（可能有点偏离我会仔细检查然后回复你:)）：

var zipArr = ['98671','97006'];//insert the zip/post codes here
var userInputEl = document.getElementById('userInput');//Get the element could use tag names or it would be better actually if you used jQuery but yeah
var elToShow = document.getElementById('elementToShowIfNotFound');
var otherElToShow = document.getElementById('idOfOtherelementToShow');
var userInput = userInputEl.value();//might be .text()
if(zipArr.indexOf(userInput) === -1){//-1 means it isn't found in the array
    zipArr.push(userInput);//pushes the new one onto the array        
    elToShow.style.display = 'block';//this changes the css display to block instead of it being hidden.    
}else{        
    otherElToShow.style.display= 'block';
}

可能不是最好的方法，但我建议使用 jQuery，它使这个过程更容易。

于 2012-10-08T19:27:42.303 回答