Double Quotes打破HTML属性和JS

时间:2015-05-07 19:16:58

标签: javascript jquery ajax character-encoding urlencode

所以我有一些从我们的产品页面中提取数据的ajax请求。这些产品页面的URL在某处可以有一个 (双引号)。这是一个必要的邪恶,我会解释原因,但请接受我必须在这些网址中保留双引号。

简而言之,我从Excel XML文件中提取内容,然后使用Javascript / jQuery执行ajax请求,从“产品页面”中提取文本和数据,然后在“产品列表”页面上显示这些内容。同样,这些“产品页面”的网址有时会带有双引号。

接下来,通过函数调用这些ajax请求,并通过回调返回并使用获得的数据。直到最近,当我们发现 (双引号)打破了这些功能时,这些功能才起作用。这些双引号正在 url 这些AJAX请求的变量。我已经阅读了一些其他帖子提到打破他们的脚本的引用,但许多人找到了解决方案,而我无法做到。

我甚至尝试过var href = encodeURI( $(this).text() );var href = encodeURIComponent( $(this).text() );。这些似乎没有解决问题。在我继续之前,让我告诉你我的剧本。

XML

<Worksheet ss:Name="Recommended">
<Table ss:ExpandedColumnCount="1" ss:ExpandedRowCount="5" x:FullColumns="1"
 x:FullRows="1" ss:DefaultRowHeight="15">
 <Column ss:AutoFitWidth="0" ss:Width="96.75"/>
 <Row ss:AutoFitHeight="0">
  <Cell><Data ss:Type="String">/2U-12&quot;-Economy-Rack-Shelf-KH-3000100202/</Data></Cell>
 </Row>
</Table>
</Worksheet>

JS

$(this).find('Data').each(function(){

  var href = $(this).text();

  // This is where the 'url' is getting it's value from the 'href' variable
  // that is being pulled from the XML file 'Data'
  getProductData('name', href, function(val) {

    console.log(val);

  });

});

// Get data from the product page anywhere (Global)
function getProductData(type, url, callBack) {

  $.ajax({
    url: url,
    method: 'GET',
    dataType: 'html',
    success: function(data){

      var $data = $(data).find('#product-data');

      var val = $data.data(type);

      return callBack( val );

    },
    error: function(data) {
      console.error( 'getProductData: ' + type + ' = FAIL / URL: ' + url );
    }
  });

}

HTML

<input type="hidden" id="product-data" data-name="{product['product_name']}">

关于如何使用这些双引号来处理我的脚本的任何想法?关于这个问题似乎很少......我在发展的这些年里没有遇到过这个问题:(

当AJAX请求使用此字符串作为url参数时,我无法获取引号(实际上在XML文件中编码为&quot;)以进行正确编码...

以上结果是我的 getProductData() 根本不返回任何内容。当 url 变量在字符串中不包含双引号时,同样的函数返回数据...

修改

我也试过var href = $(this).text().replace('"', '\"'); btw。

编辑所以我错误地诊断了我的问题。 AJAX请求正在运行,返回的值只是被引号破坏了。所以,问题是引号使我的HTML中的属性分崩离析,AJAX请求正常。

我正在重新命名帖子以更好地标记我遇到的问题。有时,这是最基本的东西会破坏我们的东西吗?

2 个答案:

答案 0 :(得分:1)

您不能将带双引号的字符串放在一个本身用双引号括起来的属性中。虽然我不知道您使用什么技术来设置数据名称属性的值,但无论您使用什么,都必须将双引号转换为&quot;。在PHP中,您将使用htmlspecialchars函数。使用JavaScript,您可以使用.replace(/"/g,"&quot");

最终结果应如下所示

<input type="hidden" id="product-data" data-name="2U-12&quot;-Economy-Rack-Shelf-KH-3000100202"

答案 1 :(得分:0)

所以最终我要做的是:

  • 将HTML中的双引号更改为单引号
  • 将href变量传递给getProductData()
  • 时使用var href = encodeURI( $(this).text() );

我本可以在数据名称值上使用.replace('"', '&quote')来解决问题,但我不喜欢使用javascript,除非绝对必要......这将是更清洁的IMo,但是啊..