设置移动端的搜索键盘

最新推荐文章于 2020-07-18 01:43:21 发布

qq_14936009

最新推荐文章于 2020-07-18 01:43:21 发布

阅读量187

点赞数

分类专栏： html5 移动端文章标签：移动端

本文链接：https://blog.csdn.net/qq_14936009/article/details/80408410

版权

3 篇文章 0 订阅

订阅专栏

2 篇文章 0 订阅

订阅专栏

 
 <!doctype  
 html 
 > 

 
 <html  
 lang= 
 "en" 
 > 

 
 <head> 

 
  <meta  
 charset= 
 "UTF-8" 
 > 

 
  <title> 
 Document 
 </title> 

 
  <meta  
 name= 
 "viewport"  
 content= 
 "width=device-width, initial-scale=1, user-scalable=no, minimal-ui" 
 /> 

 
  <meta  
 name= 
 "format-detection"  
 content= 
 "telephone=no, email=no" 
 /> 

 
  <style> 

 
   
 :: 
 -webkit-search-cancel-button  
 {  
 display 
 :  
 none 
 ;  
 } 

 
   
 </style> 

 
  <script  
 type= 
 "text/javascript" 
 > 

 
   
 function  
 seacherKeyDown 
 (e){ 

 
   
 // 
 搜索判断是移动端还是 
 pc 
 端 

 
   
 var  
 e = e ||  
 window 
 . 
 event 
 ; 

 
   
 if 
 (e. 
 keyCode  
 ==  
 13 
 ){ 

 
   
 var  
 leftVal =  
 $ 
 . 
 trim 
 ( 
 $ 
 ( 
 "#js_id_seach" 
 ). 
 val 
 ()) 
 ; 

 
   
 if 
 (leftVal== 
 0  
 || leftVal== 
 ' 
 搜索关键字 
 ' 
 ){ 

 
   
 $ 
 ( 
 "#js_id_seach" 
 ). 
 focus 
 () 
 ; 

 
   
 } 
 else 
 { 

 
   
 window 
 . 
 location 
 . 
 href 
 = 
 '/was5/web/search?channelid=294808&searchword=' 
 + 
 encodeURIComponent 
 (leftVal) 
 ; 

}

}

}

 
   
 </script> 

 
 </head> 

 
 <body> 

 
 <form  
 action= 
 "#"  
 target= 
 "testif" 
 > 

 
  <input  
 type= 
 "search"  
 placeholder= 
 " 
 搜医生、搜疾病 
 "  
 οnkeypress= 
 " 
 seacherKeyDown 
 ( 
 event 
 ) 
 " 

 
   
 id= 
 "js_id_seach"  
 style= 
 " 
 width 
 :  
 300 
 px 
 ; 
 height 
 :  
 50 
 px 
 ; 
 " 
 /> 

 
  <iframe  
 name= 
 "testif"  
 style= 
 " 
 display 
 :  
 none 
 ; 
 " 
 ></iframe> 

 
 </form> 

 
 </body> 

 
 </html> 

关注