为什么jQuery在我的字符串中添加反斜杠“\”字符?

时间:2010-12-04 16:09:12

标签: javascript jquery escaping jeditable

我正在使用jQuery用字符串替换元素的内容,该字符串包含一些元素。以下是我用来创建$ value的代码,字符串:

var value =  '<span class="fn">' + $("#fn_").val() + '</span>';
$("input", this).val(value);

然而,实际输出的内容都有退格字符,如下所示:

<span class="\&quot;fn\&quot;">Name</span>

我认为这对我来说可能是一个愚蠢的错误,但不确定我做错了什么?感谢任何建议!

修改

为清楚起见,这里是完整的代码,我正在为jEditable创建一个自定义输入类型,允许我内联编辑vcard。

$.editable.addInputType('person', {
element : function(settings, original) {     
    var fn  = $('<input id="fn_"/>');
    var bday  = $('<input id="bday_" />');
    var wday  = $('<input id="wday_" />');
    var dday  = $('<input id="dday_" />');
    var spouse  = $('<input id="spouse_" />');

    $(this).append(fn);
    $(this).append(bday);
    $(this).append(wday);
    $(this).append(dday);
    $(this).append(spouse);

    /* Hidden input to store value which is submitted to server. */
    var hidden = $('<input type="hidden">');
    $(this).append(hidden);
    return(hidden);
},

content : function(string, settings, original) {
        var $data = $(string);

        var data = {};
        $data.each(function () {
            var $t = $(this);
            data[$t.attr('class')] = {
                                   class: $t.attr('class'),
                                   value: $t.text()};
        });

        alert(data.length);

        $("#fn_", this).val('Name');
        $("#bday_", this).val('Born');
        $("#wday_", this).val('Married');
        $("#dday_", this).val('Died');
        $("#spouse_", this).val('Spouse');
    },

    submit: function (settings, original) {
    var value =  "<span class=fn>" + $("#fn_").val() + '</span>' + '<span class=spouse>' + $("#spouse_").val() + '</span>' + '<span class=bday>' + $("#bday_").val() + '</span>' + '<span class=wday>' + $("#wday_").val() + '</span>' +'<span class=dday>' + $("#dday_").val() + '</span>';
        $("input", this).val(value);
    }

});

3 个答案:

答案 0 :(得分:0)

嗯,我似乎已经通过

使用了这个
'<span class=fn>'

而不是

'<span class="fn">'

即。删除类名周围的引号。出于某种原因,引号正在输出中正确放回,但是我无法使用多个类。

答案 1 :(得分:0)

如果您尝试设置跨度内的HTML,则可以采用以下方法:

.empty().append($('<span class="fn"/>').text($("#fn_").val()))

或者如果你想完全替换元素:

.replaceWith($('<span class="fn"/>').text($("#fn_").val()))

或者,如果您只想删除课程vcard,请添加课程fn,然后设置内容:

.removeClass('vcard').addClass('fn').text($("#fn_").val())

这可确保文本框中的值在插入span元素之前正确地进行HTML转义。使用.val设置元素的HTML内容是不正确的;使用.html,虽然在这种情况下没有必要。

答案 2 :(得分:0)

您是否知道在将数据发送到服务器之前执行了提交功能(请查看Jeditable源代码),这意味着您的所有“跨度”都会发送到服务器,因此可能对您的元素进行编码的是您的服务器边脚本。

干杯。