相关疑难解决方法(0)

https://jsfiddle.net/cp1ntk45/

我编写了一个函数来替换原始的 html 占位符，然后我可以设置占位符文本的样式。

它适用于 input 和 textarea 元素，
如果目标是 contentEditable div 的问题，单击一次后无法聚焦，无法输入，需要单击第二次才能聚焦...
如何仅单击一次并聚焦

var placeholder = function(el) {
  el.on('focusin', function() {
    var val = $(this).text();
    
    var placeholder = $(this).attr('data-placeholder');
    
    if (val == placeholder) {
      if ($(this).attr('data-empty') != 'false') {
        
        $(this).text('');
      }
    }
  });
  el.on('focusout', function() {
    var val = $(this).text();
    var placeholder = $(this).attr('data-placeholder');

    if (val == '') {
      $(this).text(placeholder);

      $(this).attr('data-empty', 'true');
    } else {
      $(this).attr('data-empty', 'false');
    }
  });
};

placeholder($('.textarea'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<div class="textarea" contentEditable="true" data-placeholder="placeholder">placeholder</div>

我是Svelte ( 3.0+ ) 的新手……对于我的最新项目，我想模拟许多“待办事项”列表的功能，允许您通过双击它们来编辑以前提交的待办事项（这是我正在寻找的功能示例）。

我想，第一步是弄清楚如何contentEditable使用 Svelte 和on:dblclick事件处理程序制作 div 。我无法弄清楚此任务的语法（尽管我可以使用vanilla javascript 来完成）。

这是我到目前为止的 Svelte 代码：（这是在CodeSandBox.io 上- 请参阅页面：CEDiv.svelte）

<script>
function edit(event) {
    //update db functionality goes here
    //alert("you've 'submitted' your edit")
}

function handleDblClick() {
    //I need help HERE...and probably on the div on:dblclick down below....
}
function handleKeydown() {
    key = event.key;
    keyCode = event.keyCode;
    //submit the div's content to the edit function if enter or tab is pressed. …

在谷歌浏览器中,我注意到点击某些链接似乎根本没有效果:

<a href="http://google.com">clicking this link does nothing at all.</a>

这是一个JSBin和一个JSFiddle.

这是正常的,还是表明最新版Google Chrome存在某种错误？我之前从来没有遇到过这个问题,而这些类似的链接曾经对我很好.