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

Question

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

我的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

Answer 1

您需要使用属性选择器来查找 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>

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

ajax get request for finding data attribute value

ajax

jquery