Question

我有一个带jquery的json

我想这样做：

var $item1 = $('<div class="gallery-item item1">');
var $item2 = $('<div class="gallery-item item2">');
....
var $items = $item1.add($item2).add($item3)....;

我尝试这样做，但我无法制作动态变量

   if(response){
       var items = [];
       $.each( response, function( key, val ) {
        // console.log('id :',key);
        // console.log('val :',val);
          var $item+key= $(val);
       });
       // var $items = $item1.add($item2).add($item3)....;
      }

Answer 1

$ .add（）所做的只是将所选元素添加到选择中。您的意图可能有所不同，但我从您的帖子中了解到您想要选择根据可用的JSON创建的所有新div。

为此，你可以这样做：

＆＃13;

var response = {
  "$item1": '<div class="gallery-item item1">',
  "$item2": '<div class="gallery-item item2">',
  "$item3": '<div class="gallery-item item3">'
};
if (response) {
  var $items;
  $.each(response, function(key, val) {
    eval(key + "=$('" + val + "')");
    var e = eval(key);
    $items = ($items== null)?e:$items.add(e);
  
    /* for visual output */
    e.html(key);
    $("body").append(e);
    /* for visual output */
  });
}

＆＃13;

.gallery-item {
  width: 100px;
  height: 100px;
  float: left;
  margin-right: 5px;
  padding: 20px;
}
.item1 {
  background: red;
}
.item2 {
  background: green;
}
.item3 {
  background: blue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

另外请记住，您应该尽可能避免使用eval（）。如果你真的需要做这些事情，请问自己？只需选择以下内容即可实现：

var $items = $(".gallery-item");

Javascript：jQuery：使用Json的数字前缀声明动态变量

1 个答案: