1

我已经进行了相当广泛的搜索，所以如果这已经在其他地方被覆盖，请原谅我。考虑这个小程序，它演示了我要解决的问题。我希望 .focusout() 事件在单击文本区域框到可排序列表时触发。除了列表之外，它几乎在文本区域之外的任何地方触发。有什么想法吗？

    <!DOCTYPE HTML>
    <html>
    <head>
    <style>
    textarea {
      width:90px;
      height:90px;
    }

    #la {
      width:90px;
      height:90px;
      border:1px solid black;
    }

    ul {
      margin:0;
      list-style-type: none;
    }

    li {
      border:1px solid black;
    }
    </style>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
    <script>
    $( document ).ready(function() {
      $("#la ul").sortable();
    });

    $( document ).ready(function() {
      $("#ta").focusout(function(){
        alert("out");
      });
    });

    </script>
    </head>

    <body>
    <div id="la">
    <ul>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ul>  
    </div><br>
    <div id="cont">
    <textarea id="ta">123456</textarea>
    </div>
    </body></html>
4

2 回答 2

3

这是 jQuery-ui 的一种奇怪行为......无法解释。

但是，如果您对漫游感兴趣，您可以.blur()在可排序元素上触发 on mousedown。

$(".ui-sortable-handle").on("mousedown", function(){
  if( $("#ta").is(":focus") ){ 
    $("#ta").blur();
  }
});

见这里。

而且，顺便说一句，只有一个现成的包装器足以围绕您的函数。

于 2017-08-02T03:14:07.090 回答
0

谢谢路易！这行得通。按照您的逻辑，我还可以在可排序块中添加一行：

    start: function() {if ($("#ta").is(":focus")) $("#ta").blur();}

...尽管这仅在执行实际排序时才有效。

于 2017-08-02T14:10:44.220 回答