输入焦点字段然后在页面加载时添加类

时间:2012-05-22 19:37:12

标签: javascript jquery load addclass

好的,这里有一个带有.cf-se-input类的输入字段。我希望这个字段能够尽快与jquery一起使用,并准备好文档。此外,如果字段在用户单击输入字段时聚焦或通过jquery焦点聚焦,我想将类添加到id为#searchput的div。这是安定的。

页面加载=> .cf-se-input成为focues =>

.cf-se-input成为焦点下一个代码将触发=>如果.cf-se-input集中在用户点击字段或jquery automaticall将其集中在页面加载addClass .cfse_a到#searchput时。

更进一步

这是我的搜索框

<div id="searchput"> <input type="textarea" class="cf-se-input" /> </div> 

我设计了.cfse_a,以便该类的任何内容都有蓝色边框。 在我的情况下,它不是具有蓝色边框的输入字段,我希望我希望searchput的div具有蓝色边框,但仅在输入字段被聚焦时。

现在有两种方法可以通过jquery或手工聚焦字段。我希望两者都被覆盖。因此,如果用户单击输入并且它变得聚焦,我仍然希望将addClass添加到#searchput。另外如果在页面加载jquery强制输入字段被聚焦,我仍然希望#searchput上添加了类.cfse_a。

2 个答案:

答案 0 :(得分:1)

您需要使用$.focus()方法。请参阅文档:http://api.jquery.com/focus/

您可以致电$('.cf-se-input').focus()将焦点移至您的文本区域。

您可以从$('.cf-se-input').focus(function() { alert('focused!'); });致电$(document).ready,以便在关注textarea时执行一些代码。

答案 1 :(得分:0)

以突出显示最简单的用户方式是使用CSS

.inputElement:focus {
  box-shadow: 0 0 5px #EC8937;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #EC8937;
}

如果你可以在Jquery文件就绪时为元素添加另一个类 您可以在启动时突出显示输入

但请确保您在不再需要焦点或用户点击其他内容时有办法删除该课程