如何单击动态创建的 link，然后从该 link 创建一个新的动态页面？

Question

我写了一个自定义 API（node.js 应用程序），它从 medium.com 获取有关博客的信息，现在有

文章的author/main图片，
标题，
link 到 medium.com 上的文章（冗余），
整篇文章的文本，在 JSON 输出中。

样本API/JSON:

{
"img": [
"https://upload.wikimedia.org/wikipedia/commons/4/42/Blog_%281%29.jpg"
],
"title": [
"The old and the new or not so new: Java vs JavaScript"
],
"link": [
"https://medium.com/@aki9154/the-old-and-the-new-or-not-so-new-java-vs-javascript-760f84e87610?source=rss-887f1b1ddb75------2"
],
"desc": [
"<p>It’s funny how the name JavaScript makes you believe that it is somehow..."
]
}

然后我正在轮询这个 API/JSON 并以缩略图格式吐出输出，目前基本 html（没有 design/CSS）。

我卡住的地方是当用户点击缩略图时我需要确保显示正确的文章？！

为此我需要在单击 thumbnail/article 时显示一个新页面，我可以使用上面 JSON 中的 #4 作为动态创建的新页面的输出并很好地输出)

我现在面临的问题是点击动态创建的link如何动态生成正确的文章？

现在当我点击缩略图时没有任何反应，这就是这个项目 link 显示的...

我做了一些 Whosebug 研究并阅读了一些 jQuery 文档（事件传播和更多...）并且能够对 index.js 进行更改，下面是它的样子但没有有效，任何帮助将不胜感激...

index.js:

$(function () {
  var desc = "";
  function newWin() {
    var w = window.open();
     $(w.document.body).html('<p>'+desc+'</p>');
   }
    var $content = $('.cards-in-grid');
    var url = 'link-for private use now';
    $.get(url, function (response) {
      var output = '';
      console.log(response);
      $.each(response, function (k, item) {
      title = item.title;
      var author = item.img;
      desc = item.desc;
      output += '<li><img src="'+author+'" alt=""><h2>' + title + '</h2></li>';
      $(".cards-in-grid ul").on("click", "li", function(){
        newWin;
      });
      return k;
    });
    $content.html(output);
   });
 });

Answer 1

`

$(function () {
    var $content = $('.cards-in-grid');
    var url = 'link-for private use now';
    $.get(url, function (response) {
      var output = '';
      var list = "li";
      $.each(response, function (k, item) {
        var listNum = list+k;
        var idy = "#"+listNum;
        var desc = "";
        title = item.title;
        var author = item.img;
        desc = item.desc;
        //GIVE ID to each LI using a variable
        output += '<li id="'+listNum+'"><img src="'+author+'" alt=""><h2>' + 
        title + '</h2></li>';
        $content.html(output); 
        $content.on("click",idy, function(){
          var w = window.open();
          $(w.document.body).html('<p>'+desc+'</p>');
        });
        return k;
      });
    });
 });

这很完美，经过一些思考和琢磨，终于成功了！ 如果对您有帮助，请点个赞！谢谢！

如何单击动态创建的 link，然后从该 link 创建一个新的动态页面？

How to click on a dynamically created link to then create a new dynamic page from that link?

javascript

jquery

html

node.js

dom-manipulation