有没有办法缩短这个或使它看起来更干净？ [英] Is there any way to shorten this or make this look cleaner?
本文介绍了有没有办法缩短这个或使它看起来更干净？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
Confirm that value was indeed between 1 and 20. If it is not, output a message reminding them that they must enter a value between 1 and 20, and then do not continue with the function (make the function end). Hint: Remember that a 'return' staement will a function.
If the user enters invalid input, then output the appropriate message (e.g. "You must enter a number between 1 and 20") to a div section called 'errors'. Also set the background color of the invalid text field to yellow.
Note: Each time the user clicks the button, you should remove any output from a previous run of the program. If any errors are present, you should remove any error messages, and remove the yellow background from the text field.
什么我试过了：
What I have tried:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>First Loop</title>
<style type="text/css">
.highlight { background-color:yellow; color:red; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" ></script>
<script type="text/javascript">
$(document).ready(function()
{
});
function greetMe()
{
//first clear out anything that was there before
$('#greetings').html('');
//remove highlight from any inputs remaining from a previous submit attempt
$('input').removeClass('highlight');
//clears out anything that was there before
$('#errors').html('');
//retrieve the name that the user has entered
var name = document.getElementById('txtName').value;
//retrieve the number that the user has entered
var str = parseInt($('#txtNum').val());
if (str == 1){
for (var counter=0; counter<1; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 2){
for (var counter=0; counter<2; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 3){
for (var counter=0; counter<3; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 4){
for (var counter=0; counter<4; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 5){
for (var counter=0; counter<5; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 6){
for (var counter=0; counter<6; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 7){
for (var counter=0; counter<7; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 8){
for (var counter=0; counter<8; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 10){
for (var counter=0; counter<10; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 11){
for (var counter=0; counter<11; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 12){
for (var counter=0; counter<12; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 13){
for (var counter=0; counter<13; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 14){
for (var counter=0; counter<14; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 15){
for (var counter=0; counter<15; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 16){
for (var counter=0; counter<16; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 17){
for (var counter=0; counter<17; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 18){
for (var counter=0; counter<18; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 19){
for (var counter=0; counter<19; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else if (str == 20){
for (var counter=0; counter<20; counter=counter+1)
{
$('#greetings').append("Hello, " + name + "!<br />");
}
}
else {
$('#errors').append("You must enter a number between 1 and 20!");
$('#txtNum').addClass('highlight');
return false; //ends the function
}
} //end greetMe
</script>
</head>
<body>
<p>Type in your name.</p>
<input type="text" id="txtName" >
<p>How many times would you like to be greeted? (1 - 20)</p>
<input type="text" id="txtNum">
<input type="button" value="Greet Me!" onclick="greetMe()" >
<hr>
<div id="greetings">
<!-- Section to output the greeting -->
</div>
<div id="errors">
<!-- section to output the invalid input message -->
</div>
</body>
</html>
推荐答案
（文件）.ready（function（）
{
}）;
函数greetMe（）
{
//首先清除之前的任何内容
(document).ready(function() { }); function greetMe() { //first clear out anything that was there before
（'＃greetings'）。html （ ''）;
//从先前提交尝试中剩余的任何输入中删除突出显示
('#greetings').html(''); //remove highlight from any inputs remaining from a previous submit attempt
（'input'）。removeClass（'highlight'）;
//清除之前的任何内容
('input').removeClass('highlight'); //clears out anything that was there before
这篇关于有没有办法缩短这个或使它看起来更干净？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
