我已经进行了相当广泛的搜索,所以如果其他地方已经介绍过这个问题,请原谅我。考虑这个小程序,它演示了我正在尝试解决的问题。我希望当用户从文本区域框中单击到可排序列表时触发 .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>
最佳答案
这是 jQuery-ui 的奇怪行为......无法解释。
但是,如果您对漫游感兴趣,则可以在可排序元素上的 mousedown 上触发 .blur()
。
$(".ui-sortable-handle").on("mousedown", function(){
if( $("#ta").is(":focus") ){
$("#ta").blur();
}
});
参见here .
顺便说一句,只需一个现成的包装器就足以满足您的功能。
关于jquery - 单击可排序列表时,文本区域焦点不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45450617/