jQuery将动态内容从一个元素添加到另一个元素

时间:2017-09-13 22:19:23

标签: javascript jquery

我正在向网站添加实时聊天,我遇到的问题是它会向我的CSP政策阻止的页面添加动态onclick。

通过删除动态代码并添加自己的代码,我设法解决了这个问题。

我无法弄清楚如何获取链接ID,这可能是

  

id =“online-icon”或id =“offline-icon”以及span类lhc-text-status文本

客户端不是我的强项,如果下面的代码是一团糟,请道歉,但有人可以帮助我将上述ID添加到我的代码中。

$(document).ready(function () {
    $('body').on('click', '.status-icon', function () {
        $(this).closest('#lhc_status_container').remove();

        $('<div id="lhc_status_container">' +
            '<a id="NEED TO ADD STATUS HERE" class="status-icon" href="#">' +
            '<span class="lhc-text-status">AND HERE</span>' +
            '</a>' +
            '</div>').appendTo("#liveChatCase");


        $("#online-icon").click(function () {
            return window.lh_inst.lh_openchatWindow();
        });
    });
});

下面是如何将动态代码添加到页面的示例。

<div id="lhc_status_container">
<a id="online-icon" class="status-icon" href="#" onclick="return lh_inst.lh_openchatWindow()">
<span class="lhc-text-status">Live help is online...</span></a>
</div>

更新我现在已经设法获得id =“需要在此处添加状态”的值,但仍在处理lhc-text-status

1 个答案:

答案 0 :(得分:0)

解决了问题,代码在下面,如果有人可以改进它,我将不胜感激,因为我需要在打开之前点击两次实时聊天div

$(document).ready(function () {
    $('body').on('click', '.status-icon', function () {
        var statusId = $(this).attr('id');
        var textStatus = $(".lhc-text-status").text();
        $(this).closest('#lhc_status_container').remove();

        $('<div id="lhc_status_container">' +
            '<a id="'+ statusId +'" class="status-icon" href="#">' +
            '<span class="lhc-text-status">' + textStatus +'</span>' +
            '</a>' +
            '</div>').appendTo("#liveChatCase");


        $(".status-icon").click(function () {
            return window.lh_inst.lh_openchatWindow();
        });
    });
});

确定双击问题,修改后的代码

$(document).ready(function () {
    $('body').on('click', '.status-icon', function () {
        var statusId = $(this).attr('id');
        var textStatus = $(".lhc-text-status").text();
       // $(this).closest('#lhc_status_container').remove();

        $('<div id="lhc_status_container">' +
            '<a id="'+ statusId +'" class="status-icon" href="#">' +
            '<span class="lhc-text-status">' + textStatus +'</span>' +
            '</a>' +
            '</div>').appendTo("body");

        return window.lh_inst.lh_openchatWindow();

       // $(".status-icon").click(function () {
       //     return window.lh_inst.lh_openchatWindow();
        //});
    });
});