blocks|key|4578130|text|下面是如何使用switch()语句的示例：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4578131|var+expression+=+"1";

switch(expression)+{
++++case+"1":
++++++++//this+will+be+executed
++++++++break;
++++case+"2":
++++++++//wont+be+executed
++++++++break;
++++default:
++++++++//wont+be+executed,+since+a+match+was+found
}|code-block|syntax|javascript|4578132|最好使用一个switch，而不是使用2-3个if/then/else语句。|4578133|你可以在这里找到更多的例子：http://www.w3schools.com/js/js_switch.asp|4578134|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3schools.com/js/js_switch.asp^0|7|8|0|0|6|6|M|C|0|E|15|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|15|8|@]|D|@$9|16|A|17|1|18]]|E|$]]|$1|O|3|-4|5|6|7|19|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

<p>An example of how to use <code>switch()</code> statement would be like this:</p>

<pre><code>var expression = "1";

switch(expression) {
    case "1":
        //this will be executed
        break;
    case "2":
        //wont be executed
        break;
    default:
        //wont be executed, since a match was found
}
</code></pre>

<p>It is better to use one <code>switch</code> instead of using 2-3 <code>if/then/else</code> statements.</p>

<p>You can find more examples here: <a href="http://www.w3schools.com/js/js_switch.asp" rel="nofollow">http://www.w3schools.com/js/js_switch.asp</a></p>


blocks|key|71809|text|这不是switch语句的工作方式。您不能在开关的情况下编写不同的表达式。它只能将表达式与case语句中定义的单个值进行比较。另一种解释见：Expression+inside+switch+case+statement|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|71810|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/3463833/expression-inside-switch-case-statement^0|1X|13|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

<p>That's not the way, how switch statement works. You can not write different expressions in the case of a switch. It can only compare the expression to a single value defined in a case statement.
See another explanation at: <a href="https://stackoverflow.com/questions/3463833/expression-inside-switch-case-statement">Expression inside switch case statement</a></p>


blocks|key|71834|text|尽管这不是使用开关的好方法，但您可以这样操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|71835|switch(true){
+case+(inputData+==+"")+:
+//+your+code
+break;
+case+(inputData.length<3)+:
+//your+code
+break;
+default:
+//your+code
+break;
}|code-block|syntax|javascript|71836|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Although not a good way to use switches you ca proceed like this:</p>

<pre><code>switch(true){
 case (inputData == "") :
 // your code
 break;
 case (inputData.length&lt;3) :
 //your code
 break;
 default:
 //your code
 break;
}
</code></pre>


blocks|key|71882|text|您可以在case子句中编写表达式，但必须返回用于比较的值。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|71883|​|71884|$(function+()+{
var+$input+=+$('input[type="text"]');
$('button').on('click',+validateInput)
function+validateInput(e)+{
++e.preventDefault();

++var+alertMsg+=+"";
++var+inputData+=+$.trim($input.val());
++switch(inputData)+{
++++case+"":
++++++alertMsg+=+"Field+Can+not+be+Empty";
++++++break;
++++case+(inputData.length+<+4+&&+inputData):
++++++alertMsg+=+"Field+Can't+Be+Less+Than+4";
++++++break;
++++default:
++++++alertMsg+=+inputData;
++}
++
alert(alertMsg);

}
});|code-block|syntax|javascript|71885|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input+type="text"><button>Click+here</button>|71886|71887|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>You can write expressions in case clauses but you have to return the value for comparison.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(function () {
var $input = $('input[type="text"]');
$('button').on('click', validateInput)
function validateInput(e) {
  e.preventDefault();

  var alertMsg = "";
  var inputData = $.trim($input.val());
  switch(inputData) {
    case "":
      alertMsg = "Field Can not be Empty";
      break;
    case (inputData.length &lt; 4 &amp;&amp; inputData):
      alertMsg = "Field Can't Be Less Than 4";
      break;
    default:
      alertMsg = inputData;
  }
  
alert(alertMsg);

}
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input type="text"&gt;&lt;button&gt;Click here&lt;/button&gt;</code></pre>
</div>
</div>
</p>


blocks|key|71933|text|在我的例子中，我使用switch作为Bootstrap中表单的练习。所以我让情况之间的中断，因为程序不断跟踪更多的字段，所以它不需要检查它上的每个变体，并跳到下一个字段。我提出并反对开关应该寻找的条件。请记住，这是一个学校练习，我的界限很清楚:不允许如果/否则。以下是代码|type|unstyled|depth|inlineStyleRanges|entityRanges|data|71934|//taking+input+value+field
+let+mailLine+=+inputEmail.value;

//obj+mail
let+mailObj+=+{

++++case1+:+(mailLine+==+""),
++++case2+:+(!checkValidity(mailLine)),+
+++//function+check,+no+need+to+place+it+here!

}
//if+the+cases+are+true
switch+(true)+{

++++case+mailObj.case1:
++++++++++
++++inputEmail.classList.add("is-invalid");//bootstrap+div
++++
++++document.getElementById("errorEmail").textContent+=+"No+empty+field+allowed";
++++
++++counter+%2B%2B;+//for+more+stuff+in+the+code
++++++++
++++++++break;+//left+it+on+purpose.+No+itineration.+So+it+goes+to+password,+city...

++++case+mailObj.case2:
+++
++++inputEmail.classList.add("is-invalid");
++++
++++document.getElementById("errorEmail").textContent+=+"Not+right+mail+format";
+++
++++counter+%2B%2B;
++++++++
++++++++break;

++++default:
++++
++++inputEmail.classList.remove("is-invalid");
++++
++++inputEmail.classList.add("is-valid");
++++
++++document.getElementById("okEmail").textContent+=+"Right+mail+format";
++++
++++++++break;
}|code-block|syntax|javascript|71935|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>In my case I used switch as an exercise to a form in Bootstrap. Due so I let the break between the cases as the program keeps tracking for more fields, so it doesn't need to check every variant on it and jumps to the next field. I made and object with the conditions that the switch should look for. Pls, do remember that this is a schoolar exercise and my boundaries were quite clear: no if/else allowed. Here is the code</p>
<pre><code>//taking input value field
 let mailLine = inputEmail.value;

//obj mail
let mailObj = {

    case1 : (mailLine == &quot;&quot;),
    case2 : (!checkValidity(mailLine)), 
   //function check, no need to place it here!

}
//if the cases are true
switch (true) {

    case mailObj.case1:
          
    inputEmail.classList.add(&quot;is-invalid&quot;);//bootstrap div
    
    document.getElementById(&quot;errorEmail&quot;).textContent = &quot;No empty field allowed&quot;;
    
    counter ++; //for more stuff in the code
        
        break; //left it on purpose. No itineration. So it goes to password, city...

    case mailObj.case2:
   
    inputEmail.classList.add(&quot;is-invalid&quot;);
    
    document.getElementById(&quot;errorEmail&quot;).textContent = &quot;Not right mail format&quot;;
   
    counter ++;
        
        break;

    default:
    
    inputEmail.classList.remove(&quot;is-invalid&quot;);
    
    inputEmail.classList.add(&quot;is-valid&quot;);
    
    document.getElementById(&quot;okEmail&quot;).textContent = &quot;Right mail format&quot;;
    
        break;
}
</code></pre>


<p>I am trying a simple input validation at <a href="http://jsfiddle.net/Behseini/L8cv13tu/" rel="nofollow">This Demo</a> and as you can see I am using some nested if statements (which can be more for applying more validation rules). Now my question is if you can help me to use JavaScript Switch Statement instead of theses if statement
the reason which I got confused is the <code>(expression)</code> and <code>default:</code> part of the statement which I am totally confused how to use them in my case?</p>

<pre><code>switch(expression) {
    case n:
        code block
        break;
    case n:
        code block
        break;
    default:
        default code block
}
</code></pre>

<p>and here is my code:</p>

<pre><code>$(function () {
    $("#pro").on("click", function (e) {
        inputData = $.trim($('input[type="text"]').val());
        if (inputData == ""){
            alert("Field Can not be Empty");
        }
        else if (inputData.length&lt;3){
            alert("Field Can Be Less Than 4");
        }
        else
        {
         alert($('input[type="text"]').val());
        }
        e.preventDefault();
    });
});
</code></pre>

<p>Thanks</p>


How To Use JavaScript Switch Case in Filed Validation

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正在上尝试一个简单的输入验证，正如您所看到的，我使用了一些嵌套的if语句(这可以更多地应用更多的验证规则)。现在我的问题是，你是否可以帮助我使用JavaScript Switch语句，而不是if语句，我混淆的原因是语句中的(expression)和default:部分，我完全搞不懂了，在我的例子中如何使用它们？swi...

问如何在现场验证中使用JavaScript开关外壳
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在现场验证中使用JavaScript开关外壳EN