Question

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

文章的作者/主要照片
标题，
链接到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）（无设计/ CSS）吐出输出。

当用户单击缩略图并且需要确保显示正确的文章时，我会被卡住吗？！

单击缩略图/文章时需要为其显示新页面，我可以使用上面JSON中的＃4作为该动态创建的新页面的输出，并很好地展示出来）

我现在面临的问题是，在单击动态创建的链接时如何动态生成正确的文章？

现在，当我单击缩略图时什么也没有发生，这就是该项目链接显示的内容...

我做了一些stackoverflow研究，并阅读了一些jQuery docs（事件传播等），并且能够对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;
      });
    });
 });

这很好用，经过一些思考和思考，能够使它起作用！ 如果可以帮助您，请回答！谢谢！

如何点击动态创建的链接，然后从该链接创建新的动态页面？

1 个答案: