如何解码包含html元素的javascript变量值

Posted 2023-03-05

【中文标题】如何解码包含html元素的javascript变量值

【英文标题】：How to decode javascript variable value which contain html element

【发布时间】：2015-07-30 00:48:42

【问题描述】：

我有一个变量，其中包含一些文本和锚标记元素，例如

var success_msg = 'Please <a href="javascript:void(0);" id="popup-login" class="login" title="Login">login</a> to save your wishlist.';

现在我将这个变量传递给 ajax，并且这条消息在 ajax 成功时显示并弹出。

Ajax 代码：

var success_msg = 'Please <a href="javascript:void(0);" id="popup-login" class="login" title="Login">login</a>+ to save your wishlist.';
$.ajax(
    type: "POST",
    url: BASE_URL+"home/featherlightInfo",
    data: "success_msg="+success_msg,
    success: function (html) 
        $('#loading-div').hide(); // Hide Ajax loader
        $('#featherlightInfoPop').html(html);
        $.featherlight('#featherlightInfo');                    

        setTimeout(function()
            $(".featherlight-close").trigger("click");
        , 5000);

        $('#feathre').addClass('login-feathre');
    
);

一切都很完美，但在弹出的 HTML 中，我得到了这样的锚标记：

<a title="\&quot;Login\&quot;" class="\&quot;login\&quot;" id="\&quot;popup-login\&quot;" href="\&quot;javascript:void(0);\&quot;">login</a>`

奇怪的是，这段代码在我的本地服务器上运行良好。

我想要这个结果：Please <a href="javascript:void(0);" id="popup-login" class="login" title="Login">login</a> to save your wishlist.

那么如何获得合适的锚元素呢？

【问题讨论】：

听起来应该是固定的服务器端，而不是客户端

所以你正在向服务器传递一条消息，然后将它发送回客户端，然后发出警报？？有什么意义？

为什么不直接从服务器端发送 html？它更干净，也不复杂。

【参考方案1】：

试试javascript的encodeURI函数：

var success_msg = 'Please <a href="javascript:void(0);" id="popup-login" class="login" title="Login">login</a>+ to save your wishlist.';
var encode_msg = encodeURI(success_msg);

For more read documentation.

或

您可以在 ajax 请求中传递标志消息，并在此基础上在服务器端创建此'Please <a href="javascript:void(0);" id="popup-login" class="login" title="Login">login</a>+ to save your wishlist.'; HTML 代码。这将是一个很好的做法。

【参考方案2】：

根据jqueryajax：当你向服务器发送数据时，它会被转换成一个查询字符串，所以引号被转义了。

data 选项可以包含以下形式的查询字符串 key1=value1&key2=value2，或 key1: 'value1' 形式的对象， 键2：'值2'。如果使用后一种形式，则转换数据 在发送之前使用 jQuery.param() 进入查询字符串。这 可以通过将 processData 设置为 false 来规避处理。这 如果您希望将 XML 对象发送到 服务器;在这种情况下，将 contentType 选项从 application/x-www-form-urlencoded 为更合适的 MIME 类型。