JavaScript递归无法正常工作 [英] JavaScript recursion does not work properly

查看:97
本文介绍了JavaScript递归无法正常工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

任何人都可以说为什么下面的递归函数不适合我?
它应该递归地收集给定元素中的所有单选按钮。
但是,由于某种原因没有找到!



感谢!!

 <?xml version =1.0encoding =Windows-1255?> 
<!DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional。 DTD>
< html xmlns =http://www.w3.org/1999/xhtml>

< head>
< script type =text / javascript>
函数AllInputs(radioElement){
this.radioInputs =((arguments.length == 1)?[radioElement]:[]);
}

AllInputs.prototype.toString = function(){
return[object AllInputs:radioInputs:+ this.radioInputs.length +];
}

AllInputs.prototype.add = function(otherAllInputs){
this.radioInputs = this.radioInputs.concat(otherAllInputs.radioInputs);

$ b $ function getAllInputsOfElement(element){
if(element.tagName.toLowerCase()==input){
if(element.getAttribute(类型)。toLowerCase()==radio){
return new AllInputs(element);
} else {
return new AllInputs();
}
} else {
var result = new AllInputs();

for(i = 0; i< element.children.length; i ++){
result.add(getAllInputsOfElement(element.children [i]));
}

返回结果;



function main(){
alert(getAllInputsOfElement(document.getElementById(MyTable)));
}
< / script>
< / head>

< body onload =main()>
< table id =MyTable>
< tr>< td>天< / td>< / tr>

< tr>< td>
< input type =radioname =DayOfTheWeekvalue =1/>< label> Monday< / label>
< input type =radioname =DayOfTheWeekvalue =2/>< label> Tuesday< / label>
< input type =radioname =DayOfTheWeekvalue =3/>< label> Wednesday< / label>
< / td>< / tr>
< / table>
< / body>
< / html>


解决方案

试试这个

 <?xml version =1.0encoding =Windows-1255?> 
<!DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional。 DTD>
< html xmlns =http://www.w3.org/1999/xhtml>

< head>
< script type =text / javascript>
函数AllInputs(radioElement){
this.radioInputs =((arguments.length == 1)?[radioElement]:[]);
}

AllInputs.prototype.toString = function(){
return[object AllInputs:radioInputs:+ this.radioInputs.length +];
}

AllInputs.prototype.add = function(otherAllInputs){
this.radioInputs = this.radioInputs.concat(otherAllInputs.radioInputs);

$ b $ function getAllInputsOfElement(element){
if(element.tagName.toLowerCase()==input){
if(element.getAttribute(类型)。toLowerCase()==radio){
return new AllInputs(element);
} else {
return new AllInputs();
}
} else {
var result = new AllInputs();
var noOfChildren = element.children.length;
for(var i = 0; i< noOfChildren; i ++){
result.add(getAllInputsOfElement(element.children [i]));
}

返回结果;



function main(){
alert(getAllInputsOfElement(document.getElementById(MyTable)));
}
< / script>
< / head>

< body onload =main()>
< table id =MyTable>
< tr>< td>天< / td>< / tr>

< tr>< td>
< input type =radioname =DayOfTheWeekvalue =1/>< label> Monday< / label>
< input type =radioname =DayOfTheWeekvalue =2/>< label> Tuesday< / label>
< input type =radioname =DayOfTheWeekvalue =3/>< label> Wednesday< / label>
< / td>< / tr>
< / table>
< / body>
< / html>

我没有检查您想要解决的问题。我刚刚检查了你遇到的问题。



这是因为getAllInputsOfElement()中迭代变量i的作用域。



变量i没有声明为方法的本地变量,它在全局范围内可用。因此,只需使用var关键字将变量声明为本地。



尝试使用 firefug 的其他调试工具来检查JavaScript执行,以解决这类问题。



尝试将一些日志消息发现实际执行路径并分析它以查找代码执行中的问题

希望这可以解决您的问题

Could anyone say why the following recursive function does not work for me ? It should collect recursively all radio buttons in a given element. But, it does not found any for some reason !?

Thanks !!

<?xml version="1.0" encoding="Windows-1255"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <script type="text/javascript"> 
        function AllInputs(radioElement) {
            this.radioInputs = ((arguments.length == 1) ? [radioElement] : []);
        }

        AllInputs.prototype.toString = function() {
            return "[object AllInputs: radioInputs: " + this.radioInputs.length + "]";
        }

        AllInputs.prototype.add = function(otherAllInputs) {
            this.radioInputs = this.radioInputs.concat(otherAllInputs.radioInputs);
        }

        function getAllInputsOfElement(element) {
            if (element.tagName.toLowerCase() == "input") {
                if (element.getAttribute("type").toLowerCase() == "radio") {
                    return new AllInputs(element);
                } else {
                    return new AllInputs();
                }
            } else {
                var result = new AllInputs();

                for (i = 0; i < element.children.length; i++) {
                    result.add(getAllInputsOfElement(element.children[i]));
                }

                return result;
            }
        }

        function main() {
            alert(getAllInputsOfElement(document.getElementById("MyTable")));
        }
    </script>
</head>

<body onload="main()">
    <table id="MyTable">
        <tr><td>Day</td></tr>

        <tr><td>
            <input type="radio" name="DayOfTheWeek" value="1" /><label>Monday</label>
            <input type="radio" name="DayOfTheWeek" value="2" /><label>Tuesday</label>
            <input type="radio" name="DayOfTheWeek" value="3" /><label>Wednesday</label>
        </td></tr>
    </table>
</body>
</html>

解决方案

Try this

<?xml version="1.0" encoding="Windows-1255"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <script type="text/javascript"> 
        function AllInputs(radioElement) {
            this.radioInputs = ((arguments.length == 1) ? [radioElement] : []);
        }

        AllInputs.prototype.toString = function() {
            return "[object AllInputs: radioInputs: " + this.radioInputs.length + "]";
        }

        AllInputs.prototype.add = function(otherAllInputs) {
            this.radioInputs = this.radioInputs.concat(otherAllInputs.radioInputs);
        }

        function getAllInputsOfElement(element) {
            if (element.tagName.toLowerCase() == "input") {
                if (element.getAttribute("type").toLowerCase() == "radio") {
                    return new AllInputs(element);
                } else {
                    return new AllInputs();
                }
            } else {
                var result = new AllInputs();
                var noOfChildren = element.children.length;
                for (var i = 0; i < noOfChildren; i++) {
                    result.add(getAllInputsOfElement(element.children[i]));
                }

                return result;
            }
        }

        function main() {
            alert(getAllInputsOfElement(document.getElementById("MyTable")));
        }
    </script>
</head>

<body onload="main()">
    <table id="MyTable">
        <tr><td>Day</td></tr>

        <tr><td>
            <input type="radio" name="DayOfTheWeek" value="1" /><label>Monday</label>
            <input type="radio" name="DayOfTheWeek" value="2" /><label>Tuesday</label>
            <input type="radio" name="DayOfTheWeek" value="3" /><label>Wednesday</label>
        </td></tr>
    </table>
</body>
</html>

I'm not checking what you are trying to solve. I just checked the issue you are having.

It is because of the scope of the iterating variable i in getAllInputsOfElement().

The variable i not declared as local to the method, it is available in the global scope. So just declare the variable as local using var keyword.

Try to use firefug for any other debugging tools to check the javascript execution to fix this kind of issues.

Try to put some logging messages to find out actual execution path and analyse it to find the issues with the code execution

Hope this solves your problem

这篇关于JavaScript递归无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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