Question

我有一个页面，我使用AJAX请求获取选择框选项，从该数据构建一个选择框，然后使用选择框的选定值从AJAX请求返回的响应中获取其他信息（它存储为全局变量）。

因为我在从PHP AJAX处理程序返回数据之前使用htmlentities()来转义数据（我应该这样做以避免XSS攻击，对吗？），返回数据中的索引/属性名称将被转义。因此，如果AJAX响应对象如下所示：

data:
{
    ...,
    Caf&eacute;: [...],
    ...
}

然后，一旦我从该数据创建一个选择框选项，并在以后获取选择框的值，如下所示：

 $("#select").val();

从选择框中检索的值为Café。这是一个问题，因为如果我尝试从data中的那个索引获取某些东西，就像这样：

data[$("#select").val()]

然后我收到索引未定义的错误，因为索引不是Café，而是Café。

解决我遇到的问题的最佳方法是什么？可能存在PHP解决方案，例如不能逃避“安全”字符的方法，或者可能有一个好的JavaScript解决方案，那么什么是最佳选择？

编辑：根据ZubaiR的评论，没有必要将从AJAX处理程序返回的数据转义为JSON，这意味着应该解决我的问题。但是，我没有使用AJAX时遇到这个问题（当直接向页面回显数据时），所以我也希望找到一个解决方案。

Answer 1

我对你的案子做了一点测试并产生了一些奇怪的结果

您可以在jsbin

上进行测试

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
</head>
<body>
<select id="test_select">
    <option value="caf&eacute">caf&eacute (escaped value)</option>
    <option value="café">caf&eacute (not escaped value)</option>
</select>
<button id="test_button">Click to check my value from data</button>

<script type="text/javascript">
    var data = {"caf&eacute":1, "café":2};
    $(function () {
        $('#test_button').click(function() {
            alert(data[$('#test_select').val()]);
        })
    })
</script>
</body>
</html>

对于任何选择选项我在jsbin上得到“2”。在我的本地电脑上，第一个是“未定义”，第二个是“2”。

因此，要解决问题，您需要使用café作为选项值（未转义），也不要转义js值

将转义数据与JavaScript中的选择框的未转义值进行比较？

1 个答案: