代码之家 › 专栏 › 技术社区 › Chris J.

ajax获取查找数据属性值的请求

ajax jquery

Chris J. · 技术社区 · 4 年前

我想要添加数据属性值与ajax get请求相同的样式

我的jquery代码:

jQuery(function($) {
        get_stock();

        function get_stock(){
            $.ajax({
                url: vdisain_vd.url,
                type: 'GET',
                success: function(res) {
                    console.log(JSON.parse(res)); // [ { "unique_id": "Warehouse A available", "available": "1" }, { "unique_id": "Warehouse B available", "available": "0" } ]
                    $.each(JSON.parse(res), function (i, item) {
                        console.log($(this).data('shape-title'))
                        if($(this).data('shape-title') == item.unique_id) {
                            $(this).attr('style', 'color:blue');
                        }

                        console.log('item: ' + item.unique_id)
                    });

                    setTimeout(function() { get_stock(); }, 1000)
                }
            });
        }
    });

示例如果仓库不可用,我想添加 color:blue; 如果可以的话 color:green;

data-shape-title == unique_id

1 回复 | 直到 4 年前

Barmar 4 年前

您需要使用属性选择器来查找 data-shape-title 属性与 unique_id .

let res = [ { "unique_id": "Warehouse A available", "available": "1" }, { "unique_id": "Warehouse B available", "available": "0" } ];

$.each(res, function(i, item) {
  el = $(`[data-shape-title="${item.unique_id}"]`);
  if (item.available == "1") {
    el.css('color', 'blue');
  } else {
    el.css('color', 'green');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div data-shape-title="Warehouse A available">
  Warehouse A
</div>
<div data-shape-title="Warehouse B available">
  Warehouse B
</div>