获取用于动态加载的整数变量的值

Get value of integer variable for dynamic loading

本文关键字:整数 变量 加载 用于 动态 获取      更新时间:2023-09-26

我正在尝试动态创建元素并向它们添加事件侦听器。下面是一些代码:

var marks = {
  list:[{
    selected: "content",
    url: "http://youtube.com/feed/subscriptions",
    trait: "id"
  },{
    selected: "js-streams streams items",
    url: "http://twitch.tv/directory/following",
    trait: "class"
  }]
};
var l = marks.list.length;
var web = "<webview src='https://youtube.com/feed/subscriptions' preload='preload.js' disablewebsecurity></webview>";    
for(var i = 0; i < l; i++){
  var webadd = "<webview id=web" + i + " src=" + marks.list[i].url + " preload='preload.js' disablewebsecurity></webview>";
  $('#canvas1').append(webadd);
  document.getElementById("web" + (i)).addEventListener("dom-ready", function() {
        console.log("nice" + (i)); // <-- This line most likely needs changing
  });
}

现在,我可以在每个元素上获取我的元素和事件侦听器,但是当涉及到控制台日志时,它会打印出两次"nice2"。有没有办法让这条线将var i的值作为整数而不是i本身?理想情况下,我希望它打印出nice0nice1。有什么想法吗?谢谢。

你最好使用 forEach 循环。这样,您可以有一个闭包并保持上下文。也读起来更好。

 mark.list.forEach(function(item, i){
   var webadd = "<webview id=web" + i + " src=" + item.url + " preload='preload.js' disablewebsecurity></webview>";
   $('#canvas1').append(webadd);
  document.getElementById("web" + i).addEventListener("dom-ready", function() {
        console.log("nice" + i); // <-- 
  });
})

您需要一个额外的函数来创建事件侦听器并将当前i绑定到它:

document.getElementById("web" + (i)).addEventListener("dom-ready", (function(n) { 
    return function() {
        console.log("nice" + (n));
    }
})(i));