交互式堆栈使用复选框s1和s2以及不同的函数 [英] interactive stack using checkbox s1 and s2 and different functions

查看:106
本文介绍了交互式堆栈使用复选框s1和s2以及不同的函数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图制作Stack的工作模式,用户可以在其中选择堆栈s1或s2,并可以执行像push和pop这样的操作。

 < html> < HEAD> < title> Stack With Constructor< / title> < /头> <身体GT; < DIV> < p id =p1>堆叠< / p> < input type =checkboxid =stack1value =s1> s1< br> < input type =checkboxid =stack2value =s2> s2< br> < textarea id =tdisplay>< / textarea> < textarea id =tpush>< / textarea> < button onclick =doJob()> push< / button> < button onclick =doJob1()> pop< / button> < textarea id =tpop>< / textarea> < / DIV> <脚本>函数myfunction(){if(document.getElementById(stack1)。checked == true){console.log('myFunction called!'); s1 = new MyStack(); } if(document.getElementById(stack2)。checked == true){s2 = new MyStack(); }} function push(v){if(this.st === 0){console.log(Stack Overflow); } else {this.st = this.st  -  1; this.stk [this.st] = v; 。的document.getElementById( t显示)值= this.print(); }} function pop(){if(this.st === 10){console.log(Stack Underflow); }其他{var temp = this.stk [this.st]; this.st = this.st + 1; 。的document.getElementById( t显示)值= this.print();返回温度; }} function print(){console.log(Printing Stack); var str =; //空字符串(var i = this.st; i <10; i ++){console.log(this.stk [i]); str + = this.stk [i] +'\\\
'; //连接数值和新行} return str; };函数MyStack(){this.st = 10; this.stk = new Array(10); this.push = push; this.pop = pop; this.print = print; }; var s1 = new MyStack();函数doJob(){var x = document.getElementById(tpush).value; s1.push(X); 。的document.getElementById( tpush)值= ; } function doJob1(){var y = s1.pop(); 。的document.getElementById( TPOP)值= Y; }< / script> < / body>

我不知道如何使用复选框方法。这意味着当我选择s1复选框时,它应该创建s1堆栈,并且我可以对它执行操作,与s2一样。



结果应该是交互式堆栈的正确浏览器函数所以它可以像下面的步骤一样工作:

用户选择s1或s2堆栈
如果他/她选择s1,则它们可以用于s1的所有操作。
用户也可以在s2之间切换并执行所有操作。
我在复选框工作时遇到问题。

解决方案

我认为你可以通过单选按钮获得更多运气。如果s1和s2是单选按钮组,如

< br>
< input type =radioname =stack_selectid =stack2value =s2> s2



然后,您可以监听某个函数中是否发生更改,并让其他UI组件更新适当的选定堆栈。

您的案例中复选框的问题在于它们并不相互排斥,并且您似乎永远不想同时选择s1和s2。

I am trying to make working model of Stack in which user can select the stack s1 or s2 and can perform operations like push and pop.

<html>
    <head>
        <title>Stack With Constructor </title>
    </head>
    <body>
        
        <div>
            
            
            <p id="p1">
                stack
            </p>
            <input type="checkbox" id="stack1" value="s1">s1
            <br>
            <input type="checkbox" id="stack2" value="s2">s2
            <br>
            <textarea id="tdisplay"></textarea>
            <textarea id="tpush"></textarea>
            <button onclick="doJob()">push</button>
            
            <button onclick="doJob1()">pop</button>
            <textarea id="tpop"></textarea>
        </div>
        
        <script>
             function myfunction() {
        if (document.getElementById("stack1").checked == true) {
            console.log('myFunction called!');
            s1 = new MyStack();
        }
        if (document.getElementById("stack2").checked == true) {
            s2 = new MyStack();
        }
    }
            function push(v) {
                if (this.st === 0) {
                    console.log("Stack Overflow");
                } else {
                    this.st = this.st - 1;
                    this.stk[this.st] = v;
                    document.getElementById("tdisplay").value=this.print();
                }
            }

            function pop() {
                if (this.st === 10) {
                    console.log("Stack Underflow");
                } else {
                    var temp = this.stk[this.st];
                    this.st = this.st + 1;
                    document.getElementById("tdisplay").value=this.print();  
                    return temp;
                }
            }

            function print() {
                console.log("Printing Stack");
                var str = "";//empty string
                for (var i = this.st ; i < 10; i++) {
                    console.log(this.stk[i]);
                    str+=this.stk[i]+'\n';//concatenate the value and a new line
                }
                return str;
            };

            function MyStack() {
                this.st = 10;
                this.stk = new Array(10);
                this.push = push;
                this.pop = pop;
                this.print = print;
            };

            var s1 = new MyStack();

            function doJob() {
                var x=document.getElementById("tpush").value;
                s1.push(x);
                
                document.getElementById("tpush").value="";
            }
            function doJob1(){
                var y=s1.pop();

                document.getElementById("tpop").value=y;
                              
            }
        </script>
    </body>

I don't know how to use checkbox method. It means when i select s1 checkbox it should create s1 stack and I can do operations on it and same as for s2.

The result should be proper browser functions for interactive stack so it can work like in following steps:

User select s1 or s2 stack If he/she selects s1 then they can work for all operations for s1. User can switch between s2 too and can perform all operations. I am having issues on the checkbox working.

解决方案

I think that you could have more luck with radio buttons. If s1 and s2 were a radio button group, like <input type="radio" name="stack_select" id="stack1" value="s1">s1 <br> <input type="radio" name="stack_select" id="stack2" value="s2">s2

Then you can listen to when either changes in one function, and have the other ui components update the proper, selected stack.

The problem with checkboxes for your case is that they aren't mutually exclusive, and it seems like you never want to have both s1 and s2 selected at the same time.

这篇关于交互式堆栈使用复选框s1和s2以及不同的函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆