Question

我在这里有一个单例，我试图在表单验证中使用相同的实例。我有一个包含20个onChange事件的表单，我需要使用相同的单例实例来调用下面显示的testChanges函数。有谁知道我的问题可能是什么？

这是我的.js代码

var changeChecker = (function(){
var rowNum = 0;
var houseId = 'house' + rowNum;
var spreadTypeId = 'spreadType' + rowNum;
var callPutId = 'callPut' + rowNum;
var labelRowId = 'labelRow' + ( rowNum + 1 );
var labelRowNum = 3;
var instance;
return { 
        testChanges: function(){
        spreadType = document.getElementById(spreadTypeId).options[document.getElementById(spreadTypeId).selectedIndex].text;
        alert(document.getElementById(spreadTypeId).options[document.getElementById(spreadTypeId).selectedIndex].text);
        if ( this.spreadType == 'Spread' )
        {
            rowId = document.getElementById('inputTable').rows[labelRowNum].id;
            document.getElementById(rowId).style.display = 'table-row';
            rowId = document.getElementById('inputTable').rows[labelRowNum + 1].id;
            document.getElementById(rowId).style.display = 'table-row';
            rowId = document.getElementById('inputTable').rows[labelRowNum + 3].id;
            document.getElementById(rowId).style.display = 'table-row';
            rowId = document.getElementById('inputTable').rows[labelRowNum + 4].id;
            document.getElementById(rowId).style.display = 'table-row';
            rowNum += 6;
            labelRowNum += 9;
        }
        else if ( spreadType == 'Fly' )
        {

        }
        else if ( spreadType == 'Straddle' )
        {

        }
        else if ( spreadType == 'Strangle' )
        {

        }
        else if ( spreadType == 'Tree' )
        {

        }
        else if ( spreadType == 'Condor' )
        {

        }
        else if ( spreadType == 'Ladder' )
        {

        }
        else
        {

        }

    }

}

})();

以下是我试图从20个不同位置调用testChanges函数的方法。

<select onchange='changeChecker.testChanges();' name='spreadType[]' id='spreadType0'>

或

<select onchange='changeChecker.testChanges();' name='spreadType[]' id='$spreadTypeId'>

Answer 1

如果我猜对了你要做的事情 - 你有一个包含20行的表格，每行都有一个选择标记，你附加了onchange个事件。

在您的代码示例中，checker函数是闭包的一部分，其中spreadTypeId也是成员。现在，让该变量成为此闭包的“私有”成员，并且创建此闭包的函数只执行一次 - 它的值将始终为spreadType0。

如果您正在尝试做的事情 - 您应该允许将rowNum作为参数传递给check-function：

testChanges: function(rowNum){
   //...
}

这样你的20个选择中的每一个都将被写为

<select onchange='changeChecker.testChanges(0);' name='spreadType[]' id='spreadType0'>

<select onchange='changeChecker.testChanges(1);' name='spreadType[]' id='spreadType1'>

<select onchange='changeChecker.testChanges(2);' name='spreadType[]' id='spreadType2'>

一直到

<select onchange='changeChecker.testChanges(20);' name='spreadType[]' id='spreadType20'>

另请注意 - 您为select标签指定的名称也存在问题： input / textarea / select标记的name属性是在服务器上看到的字段的名称，其中具有相同名称的元素无论如何都被理解为数组，因此[]完全冗余 - 如果没有麻烦。

Answer 2

主要问题是你有一个调试变量

var rowNum = 0

应该是

function(rowNum){

}

你在行号中硬编码了。并没有将参数添加到你的php中的函数。

即changeChecker.testChange( $i )

Javascript Singleton如何调用函数

2 个答案: