Javascript/jQuery 正在逃避我的逃避答案

【问题标题】：Javascript/jQuery is escaping my escapeJavascript/jQuery 正在逃避我的逃避
【发布时间】：2015-08-22 15:37:03
【问题描述】：

我在大型应用程序中动态生成表单。我在这里提取了一小部分代码： https://jsfiddle.net/zys3zthp/（使用 jquery）

var valuelists={};
var calcs={};
var valuelists = {"regType":{"":"","Attendee":"Attendee","Exhibitor":"Exhibitor"},"yesno":{"":"","Yes":"Yes","No":"No"},"state":{"":"","AL":"AL","AK":"AK","AZ":"AZ","AR":"AR","CA":"CA","CO":"CO","CT":"CT","DE":"DE","DC":"DC","FL":"FL","GA":"GA","HI":"HI","ID":"ID","IL":"IL","IN":"IN","IA":"IA","KS":"KS","KY":"KY","LA":"LA","ME":"ME","MD":"MD","MA":"MA","MI":"MI","MN":"MN","MS":"MS","MO":"MO","MT":"MT","NE":"NE","NV":"NV","NH":"NH","NJ":"NJ","NM":"NM","NY":"NY","NC":"NC","ND":"ND","OH":"OH","OK":"OK","OR":"OR","PA":"PA","RI":"RI","SC":"SC","SD":"SD","TN":"TN","TX":"TX","UT":"UT","VT":"VT","VA":"VA","WA":"WA","WV":"WV","WI":"WI","WY":"WY","AB":"AB","BC":"BC","MB":"MB","NB":"NB","NL":"NL","NT":"NT","NS":"NS","NU":"NU","ON":"ON","PE":"PE","QC":"QC","SK":"SK","YT":"YT"}};

function addslashes(string) {
    //return string;
    return string.replace(/\\/g, '\\\\').
        replace(/\u0008/g, '\\b').
        replace(/\t/g, '\\t').
        replace(/\n/g, '\\n').
        replace(/\f/g, '\\f').
        replace(/\r/g, '\\r').
        replace(/'/g, '\\\'').
        replace(/"/g, '\\"');
}

function printInput(field, value)
    {
        var output="";
        if (valuelists[field])
        {
            output= '<select data-field="' + field + '" style="width:50%" name="' + field + '"><option value=""></option>';
            for(var name in valuelists[field])
            {
                var label = valuelists[field][name];
                if (name!='')
                {
                    var selected="";
                    if (name==value)
                    {
                        selected=" selected='selected' ";
                    }
                    output+='<option value="' + addslashes(name) +  '" ' + selected + '>' + label + '</option>';
                }
            }
            output+= '</select>';   
        }
        else
        {
            var readonly="";
            if (calcs[field])
            {
                readonly = " readonly='readonly' ";
            }
            output = "<input data-field='" + field + "' style='width:50%' type='text' name='" + field + "' value=\"" + addslashes(value) + "\" " + readonly + ">";
        }
        return output;
    }
var output ="";
output+=printInput("state", "CA");
output+=printInput("field2", "hello \" world");

$('body').html(output);

发生的事情是我希望文本框的值是：你好“世界我想这样做是因为它是用户数据，它可以是任何东西。所以是的，它可以有单引号或双引号。

printInput("field2", "hello \" world");

我的猜测：我认为我的 addlashes 正在工作，但我认为我的转义字符在某个地方被转义了，这就是我最终得到常规斜线的方式......

【问题讨论】：

在创建 HTML 之后，直接用 JS 将值插入到 DOM 对象中，而不是将值放入 HTML 中，当然会更容易。

标签： javascript jquery escaping

【解决方案1】：

我认为最简单的解决方案是检查双引号并用单引号替换它们。

【讨论】：

但是，OP 正试图忠实地再现可能是双引号的内容。
这是个好主意，但我不能乱用用户数据，如果他们在标题字段中写“javascript“pro”，那么他们不希望它显示“javascript”pro ''。

【解决方案2】：

我的同事帮助了我。

这里是修复。此添加添加斜杠替换为在文本框中转换的 HTML 实体（不会猜到）：

function addslashes(string) {
    //return string;
    return string.replace(/\\/g, '\\\\').
        replace(/\u0008/g, '\\b').
        replace(/\t/g, '\\t').
        replace(/\n/g, '\\n').
        replace(/\f/g, '\\f').
        replace(/\r/g, '\\r').
        replace(/'/g, '&#39;').
        replace(/"/g, '&quot;');
}

【讨论】：

不需要加斜线，HTML需要转义。