Question

我有一个输入字段，上面有一个focusout事件。我还在$（'html'）上设置了一个click事件，它将焦点转移到另一个输入字段。我为输入字段写了一个click处理程序并放入event.stopPropagation（）;但它似乎没有起作用。我错过了什么？ $（'html'）指的是什么？我的代码：

p.replaceWith(
    "<input class='memoryEditField' type='text' value=" + p.text() + ">"
  );
var inputField = $(".memoryEditField");
  inputField
  .on("click", function(event) {
    event.stopPropagation();
  })
  .on("focusout", editFieldLostFocus)
  .on("keyup", editFieldKeyPressed);

另一个输入字段：

$("html").on("touchstart", function() {
    MQInput.focus();
});
$("html").on("click", function() {
    MQInput.focus();
});

Answer 1

请提供所有代码（代码中p为什么？还有editFieldLostFocus，editFieldKeyPressed）。

我认为你在方法editFieldLostFocus，editFieldKeyPressed中遗漏了一些内容，这让人觉得stopPropogation无法正常工作

事实上它按预期工作：

$(function() {
  $('p').each(function() {
    var p = $(this);
    p.replaceWith(
      '<input class="memoryEditField" type="text" value="' + p.text() + '">'
    );
  });
  
  function editFieldLostFocus() {
    console.log('call editFieldLostFocus');
  }
  
  function editFieldKeyPressed() {
    console.log('call editFieldKeyPressed');
  }
  
  var inputFields = $(".memoryEditField");
  inputFields
    .on("click", function(event) {
      event.stopPropagation();
      console.log('memoryEditField clicked');
    })
    .on("focusout", editFieldLostFocus)
    .on("keyup", editFieldKeyPressed);
    
  $("html").on("touchstart", function() {
    console.log('MQInput.focus');
    //MQInput.focus();
  });
  $("html").on("click", function() {
    console.log('MQInput.focus');
    //MQInput.focus();
  });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>FIELD 1</p><br/>
<p>FIELD 2</p><br/>

为什么event.stopPropagation不取消$（'html'）。点击？

1 个答案: