Question

我有这个代码，我需要对前两个对象做一些事情，然后用剩下的东西做其他事情，但是怎么做？我从<tr data-name='test' data-price='2' data-one='blabla' ...

获取数据

data = $(this).data();
html_option = "<table id='Unit_Options_Table'>";
// Do some thing with the first 2 
$.each(data, function(option, cost) { // Then do something with the rest
  html_option += "<tr>" +
          "<td class='Unit_Options_Name_td'>" + option + "</td>" +
          "<td class='Unit_Options_Cost_td'>" + cost + "</td>" +
          "</tr>";
});

html_option += "</table>";

Answer 1

你不能真正依赖属性的顺序。如果您可以更改标记，我建议您使用JSON作为您的值：

<tr data-name="test" data-price="2" data-items='["blabla",…]'>

var name = this.dataset.name;
var cost = this.dataset.price;
var items = JSON.parse(this.dataset.items);

var option = $("<table>", { id: "Unit_Options_Table" });

// I’m not even sure where the loop belongs here
option.append(
    $("<tr>").append(
        $("<td>", { class: "name", text: name }),
        $("<td>", { class: "cost", text: cost })
    )
);

如果不是这样，至少选择比one，two等更好的名字 - 你这样做会让自己尽可能地努力。

在评论中澄清的具体情况中，我会这样做：

<tr data-name="bla" data-cost="3" data-items='[{"name":"test","cost":20},…]'>

var data = $(this).data();
var items = $.parseJSON(data.items);

var option =
    $("<table>", { id: "Unit_Options_Table" })
        .append(
            $("<tr>").append(
                $("<th>", { text: data.name }),
                $("<th>", { text: data.cost })
            )
        )
        .append(
            $.map(items, function(item) {
                return $("<tr>").append(
                    $("<td>", { text: item.name }),
                    $("<td>", { text: item.cost })
                );
            })
        );

Answer 2

不要使用.each，你会发现它更容易。

doSomething(data[0], data[1]);
for (var i = 2; i < data.length; ++i) {
    doSomethingElse(data[i]);
}

强迫自己使用便利功能不是很方便......

Answer 3

不应该

option

如果你在迭代一个数组，那么

是索引吗？

所以它应该像

一样简单

$.each(data, function(option, cost) { 
  if(option < 2){
     //do something with first two
  }else{
     html_option += "<tr>" +
          "<td class='Unit_Options_Name_td'>" + option + "</td>" +
          "<td class='Unit_Options_Cost_td'>" + cost + "</td>" +
          "</tr>";
 }
});

为每个功能。先用2做什么，然后做其他事情？

3 个答案: