无搜索按钮的搜索栏实现

找不同

先不多说 先上图:

正确答案:明显这时候就是没有右边那个submit按钮比较好看啊，虽然我以前每次Baidu的时候都不会蠢到去按右边的Submit Button 明明按Enter就好了啊（

这是一段强迫症的经历

刚在敲一个搜索栏  由于之前是把样式定下来，没加任何表单请求。。嗯  没错,连form的tag都没加。现在过来返工。看着这个样式还不错哦~ ,  就不想给它加submit按钮了,加了反而会影响那种feel好像。然后先尝试着写了Jquery版本的，我说下大致思路:是这样的,给输入框标记，然后监听这个输入框的xxx ( 我试了"得焦和失焦" 虽然知道是不行了,由于JS的造诣不深,在应该监听什么的时候迷茫了）,然后出发.submit()，这样就可以了(这个失败了 先纳入TODO,有空再试试)。然后,因为受到某书上的提醒，(很多技术其实就跟变魔术差不多,就是欺骗用户的眼球，但会在行家(F12)下暴露无遗。)我Get到了Creative Idea 。 如果把submit藏起来会怎么样。那么怎么藏呢？display:none?虽然这是我最喜欢用的欺骗伎俩 但是这不能触发Enter啊。  我们难道不能把Submit藏起来吗？

面包总会有的

抱着这个想法,我去了SOF,果然,我找到了一个跟我想法相似的解决方案:

Ates Goral的回答

解决方案的思路还是欺骗用户 ,这波欺骗好狠,竟然把submit按钮移除了屏幕外 ,感觉自己又学到了骗人的技术了。所以我才叫它黑科技啊。

Show The Code:

<code>
  <input type="submit" style="position: absolute; left: -9999px"/>

</code>

结语

大神,请收下我的膝盖。