當你點擊我td的隱藏 div 將顯示在它的頂部,div 將被制作,contenteditable但我希望滑鼠游標出現在單擊后我可以開始輸入。目前您需要單擊兩次——一次聚焦,再次放置游標。
請不要擔心我為什么要這樣做,我只是將我的代碼剝離到基本部分來隔離這個問題。
$(document).ready(function() {
$("td").on("mousedown", function() {
var cellOffset = $(this).offset();
$('#cellSelect').offset({ top:cellOffset.top-1, left:cellOffset.left-1 });
$('#cellSelect').show(0);
$('#cellSelect').attr('contenteditable','true');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div id="cellSelect" style="display:none;position:absolute;border: 2px solid blue;width:91px;height:91px"></div>
<table border="1" cellpadding="10" width="100" height="100">
<tr>
<td id="1-1"></td>
</tr>
</table>
uj5u.com熱心網友回復:
呼叫focus元素。
您需要將focus呼叫包裝在 a 中setTimeout以確保元素在聚焦之前可編輯,否則您將無法輸入。
$(document).ready(function() {
$("td").on("mousedown", function() {
var cellOffset = $(this).offset();
$('#cellSelect').offset({ top:cellOffset.top-1, left:cellOffset.left-1 });
$('#cellSelect').show(0);
$('#cellSelect').attr('contenteditable','true');
setTimeout(() => $('#cellSelect').focus(), 0)
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div id="cellSelect" style="display:none;position:absolute;border: 2px solid blue;width:91px;height:91px"></div>
<table border="1" cellpadding="10" width="100" height="100">
<tr>
<td id="1-1"></td>
</tr>
</table>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/361727.html
標籤:javascript 查询
上一篇:如何獲取多個同名鍵的JSON值
