javascript - 如何将输入值从 HTML 传递到 JavaScript 以用于切换包含函数的情况

标签 javascript html switch-statement

这是两个不同的文件,其中 JavaScript 文件是从 html 页面引用的。

当我尝试两次运行代码时,它只运行 switch 语句的默认情况,而不运行其他情况。

THIS IS THE JAVASCRIPT FILE.

var gaadi = ["Santro", "Mercedes", "Maruti"];
var gaadi2 = ["Audi", "Honda", "Hyundai"];
var gaadi3 = ["Car1", "Car2"];



function selection()
{
    var input;
    input = document.getElementById("input").value;
    
    switch (input)
    {
    case 0: function myFunction(){
        
        var person ={firstName:"R",
                     lastName:"J",
                     id:2459,
                     fullName:function(){
                        x = 12.678;
                         return parseFloat(x);
                     }};
    
    document.getElementById("demo").innerHTML=gaadi;
        
    
}
        break;
    case 1: function myFunction2(){
        
        
        document.getElementById("demo").innerHTML = gaadi2;
    
    }

        break;
        
    case 2: function myFunction3(){
        var gaadimeet = gaadi.concat(gaadi2,gaadi3);
        var gaadislice = gaadimeet.slice(2,5);
        document.getElementById("demo").innerHTML= gaadimeet.sort();
        document.getElementById("demo").innerHTML= gaadislice;
    }
    
        break;
        
    case 3: function myFunction4()
    {       
        if(gaadi[0] =="Santro") {
        document.getElementById("demo").innerHTML = "There is car";
    }
        else {
        document.getElementById("demo").innerHTML = "There is no such car";
             }
    }
        break;
            

    default: document.getElementById("demo").innerHTML="Sorry Wrong Input";
            
    }
}
    
    

THIS IS THE HTML FILE
<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
    
</head>
<body>
    
   
    <h1 id="demo">Display</h1>
    
    
    <br>
    
    <input id="input" value="0" />
    
    <button onclick="selection()">Click Here</button>
    <script src="myScript.js"></script>
    </body>
</html>

最佳答案

像 @Nasim Bahar 提到的第一个问题,你必须将 int 更改为字符串 make switch 才能知道你选择了哪些选项, 第二,如果我猜没有错的话,你想在切换到目标情况时触发 fn,对吗? 如果是这样,你必须将你的 case 函数更改为 IIFE 函数,它会自行触发函数。

我只是为您对示例进行一些更改

case '0':(function myFunction(){

            var person ={firstName:"R",
                         lastName:"J",
                         id:2459,
                         fullName:function(){
                            x = 12.678;
                             return parseFloat(x);
                         }};

            document.getElementById("demo").innerHTML=gaadi;


        })()
        break;

以及下面的工作演示

        var gaadi = ["Santro", "Mercedes", "Maruti"];
        var gaadi2 = ["Audi", "Honda", "Hyundai"];
        var gaadi3 = ["Car1", "Car2"];



        function selection() {
            var input;
            input = document.getElementById("input").value;
            
            switch (input) {
            case '0': (function myFunction(){
                
                var person ={firstName:"R",
                             lastName:"J",
                             id:2459,
                             fullName:function(){
                                x = 12.678;
                                 return parseFloat(x);
                             }};
            
                document.getElementById("demo").innerHTML=gaadi;
                    
                
            })()
                break;
            case '1': (function myFunction2(){
                            
                            
                            document.getElementById("demo").innerHTML = gaadi2;
                        
                        })()

                break;
                
            case '2': (function myFunction3(){
                            var gaadimeet = gaadi.concat(gaadi2,gaadi3);
                            var gaadislice = gaadimeet.slice(2,5);
                            document.getElementById("demo").innerHTML= gaadimeet.sort();
                            document.getElementById("demo").innerHTML= gaadislice;
                        })()
            
                break;
                
            case '3': (function myFunction4()
                        {       
                            if(gaadi[0] =="Santro") {
                            document.getElementById("demo").innerHTML = "There is car";
                        }
                            else {
                            document.getElementById("demo").innerHTML = "There is no such car";
                                 }
                        })()
                break;
                    

            default: document.getElementById("demo").innerHTML="Sorry Wrong Input";
                    
            }
        }
<h1 id="demo">Display</h1>
    
    
    <br>
    
    <input id="input" value="0" />
    
    <button onclick="selection()">Click Here</button>

关于javascript - 如何将输入值从 HTML 传递到 JavaScript 以用于切换包含函数的情况,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40668833/

相关文章:

javascript - 在 vue.js 组件中操作 props

c++ - 编程与原理第 6 章代币与计算器

java - 开关 : 7 of 19 missed 的 eclemma 分支覆盖率

javascript - 在 Nuxt.js 中完全呈现路由后运行函数

javascript - 如何访问我在 HTML 中创建的 DIV 网格

html - 在个人 tumblr 帖子中编辑 CSS

html - 容器内的全宽 div 和柔性行

javascript - 访问器/修改器

javascript - 标题 div 在滚动时保持不变,但向上移动到下一个,但保持在 nabber 菜单下方

PHP 开关,为什么这不起作用?