jquery - 在jquery ajax请求中获取xml元素属性值

Question

我有一个具有以下格式的 xml 文件

<Products>
<Product id="1">
  <ProductName>RegEB-Tote</ProductName>
  <ImageFileName>ToteTank_350g.png</ImageFileName>
</Product>
<Product id="2">
  <ProductName>RegEB-Drum</ProductName>
  <ImageFileName>N/A</ImageFileName>
</Product>
<Product id="3">
  <ProductName>RegEB-5Gal</ProductName>
  <ImageFileName>5Gallon.png </ImageFileName>
</Product>
<Product id="4">
  <ProductName>RegEB-Gal</ProductName>
  <ImageFileName>GalSqueezeBottle.png</ImageFileName>
</Product>

我正在尝试根据 Products id 属性值获取图像文件名，但出现 xml 处理错误

 $(document).ready(function () {
        function getParameterByName(name) {
            name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
            var regexS = "[\\?&]" + name + "=([^&#]*)";
            var regex = new RegExp(regexS);
            var results = regex.exec(window.location.search);
            if (results == null)
                return "";
            else
                return decodeURIComponent(results[1].replace(/\+/g, " "));
        }

        var prodid = getParameterByName("ID");
        var fieldheight = ($('#fld_productDetails').height());

        $.ajax({
                type: "GET",
                url: "OtherDataFiles/ProductImageLookup.xml",
                dataType: "xml",
                success: function (xml) {
                 $(xml).find('Product').each(function () {
                  if ($(this).attr('id').value === prodid)
                     {
                        var filename = $(this).find('ImageFileName').text();

                        $('#fld_productDetailImage').css({ 'height': fieldheight,'url': "../Images/ProductImages/" + filename + "no-repeat center" });
                    }
            });
          },
        error: function() {
          alert("An error occurred while processing XML file.");
       }
    });
    });

prodid 和 fieldheight 变量正在获得正确的值。变量文件名不是

Answer 1

$(xml).find 的 if 部分不正确，添加背景 css 的语法错误。正确的代码如下。

 if ($(this).attr('id') === prodid) {
                       var filename = $(this).find('ImageFileName').text();
                       $('#fld_productDetailImage').css({ 'height': fieldheight, 'background': "url(../Images/ProductImages/" + filename + ") no-repeat center" });
                    }