好的,这是我有一个带有 .cf-se-input 类的输入字段。我希望这个字段在文档准备就绪的情况下尽快使用 jquery 聚焦。此外,如果用户单击输入字段或通过 jquery 焦点使字段变得专注,我想将类添加到 id 为 #searchput 的div 中。这是调整。
页面加载 => .cf-se-input 变成焦点 =>
.cf-se-input 成为焦点下一个代码将触发 => 如果用户单击字段或当 jquery 自动将它集中在页面加载 addClass .cfse_a 到 #searchput 时。
更进一步
这是我的搜索框
<div id="searchput"> <input type="textarea" class="cf-se-input" /> </div>
我设置了.cfse_a样式,以便该类的任何内容都具有蓝色边框。就我而言,它不是我想要的带有蓝色边框的输入字段,我希望 searchput 的div 具有蓝色边框,但仅当输入字段聚焦时。
现在有两种方法可以通过jquery或手动聚焦字段。我希望两者都被覆盖。因此,如果用户单击输入并且它变得专注,我仍然希望将 Class 添加到 #searchput。此外,如果在页面加载 jquery 时强制输入字段聚焦,我仍然希望 #searchput 在其上添加类.cfse_a。
使用 $.focus()
方法。 请参阅文档:http://api.jquery.com/focus/。
您可以调用$('.cf-se-input').focus()
以使焦点移动到文本区域。
您可以从$(document).ready
调用$('.cf-se-input').focus(function() { alert('focused!'); });
,以便在文本区域聚焦时执行一些代码。
要使用户集中精力突出显示,最简单的方法是仅使用CSS
.inputElement:focus {
box-shadow: 0 0 5px #EC8937;
padding: 3px 0px 3px 3px;
margin: 5px 1px 3px 0px;
border: 1px solid #EC8937;
}
如果您可以在 Jquery 文档准备就绪时向元素添加另一个类您可以在启动时突出显示输入
但请确保在不再需要焦点或用户单击其他内容时有办法删除该类