在 OnKeyUp 事件问题中引用 Javascript 变量

Question

我声明了两个变量，COURSE_ID_List 和 COURSE_ID_timerId。然后它们作为参数从 OnKeyUp 事件传递给 SetFilter 函数。

如果列表未定义，则应对其进行初始化。问题是该列表始终是未定义的，因此我假设 OnKeyUp 事件中使用的 COURSE_ID_List 是按值而不是按引用传递的。我该如何解决这个问题？

谢谢

<script type="text/javascript"> 

function SetFilter(ddl, value, list, timerId) {
  if (list == undefined)
    list = new ListFilter(ddl);
  clearTimeout(timerId);
  timerId = setTimeout(function() { list.SetFilter(value);}, 1500);
}

var COURSE_ID_List;
var COURSE_ID_List_timerId;

</script>

<input name="Course" type="text" id="COURSE_ID" onKeyUp="SetFilter('COURSE_ID', this.value, COURSE_ID_List, COURSE_ID_List_timerId);" />

Answer 1

在 JavaScript 中通过引用传递是很尴尬的。对象仅具有通过引用传递的值，因此重新分配给变量名会导致该变量名具有新值，但原始变量保留其值。

我打算向 Yves M，但我从你的评论中看到你已经尝试过。另一种解决方案是使用对象并操纵它们的属性。我认为您想要实现的目标如下所示，

function SetFilter(ddl, value) {
  if (Lists[ddl] == undefined)
    Lists[ddl] = new ListFilter(ddl);

  clearTimeout(List_timerIds[ddl]);
  List_timerIds[ddl] = setTimeout(function() { list.SetFilter(value);}, 1500);
}

var Lists = {};
var List_timerIds = {};

另外，我想重申我关于选择输入处理的替代事件的评论。 oninput (HTML5) 和onpropertychange (Internet Explorer) 在捕获文本输入方面做得更好。

Answer 2

更改为...

function SetFilter(ddl, value) { 
  if (COURSE_ID_List == undefined) 
    COURSE_ID_List = new ListFilter(ddl); 
  clearTimeout(COURSE_ID_List_timerId); 
  COURSE_ID_List_timerId = setTimeout(function() { COURSE_ID_List.SetFilter(value);}, 1500); 
} 

并且

onKeyUp="SetFilter('COURSE_ID', this.value);"

更通用的方法将使用原型制作...

var Lists = { COURSE_ID_List: null, ... };

function SetFilter(ddl, value, list) { 
  if (Lists[list] == null) 
    Lists[list] = new ListFilter(ddl); 
  clearTimeout(COURSE_ID_List_timerId); 
  COURSE_ID_List_timerId = setTimeout(function() { Lists[list].SetFilter(value);}, 1500); 
} 

Answer 3

我想这可能就是您正在寻找的答案。

(function() {
    var COURSE_ID_List = {},
    COURSE_ID_List_timerId = {};
    window.setFilter=function(ddl, value) {
        var list = COURSE_ID_List[ddl];
        if (!list) {
            list = new ListFilter(ddl);
        } else if(list.getFilter() == value) {
            return;
        }
        var timerId = COURSE_ID_List_timerId[ddl];
        if (timerId) {
            clearTimeout(timerId);
        }
        COURSE_ID_List_timerId[ddl] = setTimeout(function() { list.SetFilter(value); }, 1500);
        COURSE_ID_List[ddl] = list;
        return;
    }
})();

和

<input name="Course" type="text" id="COURSE_ID" onkeyup="setFilter('COURSE_ID', this.value);" onblur="setFilter('COURSE_ID', this.value);" />