使用Bootstrap edit添加链接时，图像标签消失

Image tag disappears when adding link using Bootstrap Editable

本文关键字：图像 标签 消失 链接 Bootstrap edit 添加 使用      更新时间：2023-09-26

我试图给用户灵活地添加/编辑url到使用Bootstrap可编辑的图像，这是通常用于内联文本编辑。我在锚标记之间添加了一个图像标记，除了当用户添加链接时，图像变得隐藏/不可见之外，这工作得非常好。当页面刷新时，图像重新出现，链接保存在后端。我注意到编辑后，Html代码中的图像标签不存在。

我想知道我在这里错过了什么。代码:

        <HTML>      
        <div class="col-xs-6 col-md-3">
        <a href="{{user.facebook}}" id="linkedin" data-type="text" data-url="{{ url_for('account.AccountView:editFacebook') }}" data-pk="{{user.id}}"  data-title="Change your Facebook profile url" ><img id="facebooklogo" width="200" height = "70" class="img img-rounded" src="/static/logos/facebook.jpg"></img></a>                              
        </div>
        <Jquery>
        <link href="/static/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
        $('#facebook').editable({
        placement:"right",
        error: function (errors) {
        }
        });
        <script src="/static/bootstrap3-editable/js/bootstrap-editable.min.js"></script>

我得到了答案。只需要添加以下代码:

        $('#facebook').editable({
        placement:"right",
        error: function (errors) {
        },
        display: function(value, response) {
        $(this).html('<img src="logos/facebooklogo.jpg">');
        }
        });
        instead of just
        $('#facebook').editable({
        placement:"right",
        error: function (errors) {
        }
        });

相关文章：