gpt4 book ai didi

jquery - 使其不可编辑后删除
  • 元素的轮廓
  • 转载 作者:行者123 更新时间:2023-12-01 06:48:49 27 4
    gpt4 key购买 nike

    在可编辑的

  • 元素上单击 ENTER 后,我想简单地退出编辑模式(不闪烁光标)并使
  • 元素不可编辑。我删除了默认的橙色轮廓,但当我打字时它不在那里。但是一旦我按下 ENTER 键,它就会出现。为什么它在那里以及如何将其删除? Here is jsFiddle和实际代码:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    [contenteditable="true"]:active,
    [contenteditable="true"]:focus{
    border: 1px solid rgb(179,179,179);
    outline:0px solid transparent;
    }
    </style>
    <script type="text/javascript" src="jquery-1.9.1.js"></script>
    <script>
    $(document).ready(
    function() {
    $('#click_me').click(function() {
    var item = "<li class='option-item new' contenteditable='true'>simple element2<li>"
    var container = $("#ctx-options");
    container.append(item);
    var $last = $(".option-item", container).last();
    //neither of these works
    $last.focus();
    });

    $("#ctx-options").on('keydown', '.option-item.new', function(e) {
    if(e.keyCode == 13)
    {
    e.preventDefault();
    $(this).attr('contentEditable', false);
    }
    })

    });
    </script>
    </head>
    <body>
    <span id="click_me">click me</span>
    <ul id="ctx-options"></ul>
    </body>
    </html>

  • 最佳答案

    您将该属性设置为 false,因此 CSS 选择器 [contenteditable="true"] 不再与该元素匹配,并且轮廓变得可见。只要这样做:

    .option-item {outline: none;}

    解决它!

    FIDDLE

    关于jquery - 使其不可编辑后删除 <li> 元素的轮廓,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18291595/

    27 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com