Question

我有一个ROW类的div元素。我执行$ .each（$（“。row），并分配一个包含唯一ID的data-id属性。但是当我尝试选择元素时，找不到ID。

我可以在Firefox的调试器中运行$（“。row”）。data（“ id”），并且得到正确的值，但是当我尝试选择$（“。row [data-id ='1' ]“），它在Firefox的Inspector中找不到任何元素，也没有显示任何数据属性。

如果我在html中定义data-id，则可以按预期工作，但是我需要动态分配值。

代码：

#include<iostream>
using namespace std;

class Road
{
private:
int length_miles;
int width_feet;

public:
void set_length(int l)
{
    length_miles = l;
}
void set_width(int w)
{
    width_feet = w;
}

int get_length()
{
    return length_miles;
}
int get_width()
{
    return width_feet;
};

int asphalt(int thickness)
{
    return 1+1; //placeholder forumala
}

};


int main()
{
    Road MainRoad;
    int length;
    int width;
    int thickness;


    cout << "Please enter the length of the road in miles" << endl;
    cin >> length;
    MainRoad.set_length(length);

    cout << "Please enter the width of the road in feet" << endl;
    cin >> width;
    MainRoad.set_width(width);

    cout << "Please enter the thickness of the road in BLANK" << endl;
    cin >> thickness;

    cout << "The amount of asphalt needed for the road is " << MainRoad.asphalt(thickness);

}

选择：

<div class="row">
...
</div>

$.each($(".row"), function (i) {
    var $row = $(this);

    $row.data("id", i);
});

Answer 1

使用$.attr('data-id', ...)代替$.data('id', ...)。

还请注意，您正在尝试访问元素data-id=1，如果您只有一个.row元素，则该元素不存在。

$.each($(".row"), function (i) {
    var $row = $(this);
    $row.attr("data-id", i);
});

console.log($('.row[data-id=1]'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="row">
1...
</div>

<div class="row">
2...
</div>

$.data将设置内部数据属性值，而$.attr会将属性添加到DOM。

选择中不能使用动态分配的数据属性

1 个答案: