<html><body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0-beta1.js"></script>
  <script type="text/javascript">
    $(function(){
      var a;
      $('#js').click(function(){
        var a=$.trim($('.research').val());        if(a==""){
          alert('请输入搜索内容');
        }else{
          alert(a)
        }
      });
      $('.research').keyup(function(evt){
        var evt = (evt) ? evt : ((window.event) ? window.event : "")
        var keyCode = evt.keyCode ? evt.keyCode : (evt.which ? evt.which : evt.charCode);
        console.log(keyCode)
        if(keyCode == 13){
          $('#js').click();
        }
      });     
    })
  </script>
  <ul>
    <li class="nav_08">
      <a id="js" href="#">qqqq</a>
      <input class="research" type="text" name="research"/>
    </li>
  </ul>
</body>
</html>

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
    input{border:none;background:none;float:left;padding:0;margin:0;}
    .search{width:350px;height:38px;border:solid 1px #000;margin:100px auto;}
    .search .sText{width:300px;height:38px;line-height:38px;font-size:14px;}
    .search .sBtn{width:50px;height:38px;background:red;text-align:center;color:#fff;font-size:14px; cursor:pointer;}
    </style>
    <script>
    window.onload=function()
    {
    var oText=document.getElementById('sText');
    var oBtn=document.getElementById('sBtn');
    oBtn.onclick=function()
    {
    alert(oText.value);
    }
    oText.onkeypress=function(ev)
    {
    var ev=ev||event;
    if(ev.keyCode==13||ev.which==13)
    {
    alert(oText.value);
    }
    }
    }
    </script>
    </head><body>
    <div class="search">
    <input type="text" class="sText" id="sText"/>
        <input type="button" class="sBtn" id="sBtn" value="搜索" />
    </div>
    </body>
    </html>
      

  2.   

    大神们,需要兼容ie6-8啊,2楼的大神给的是jq1.11吧,似乎不兼容ie6-8啊...
      

  3.   

    你测试下呗 我里面用的jq跟浏览器兼容没多大关系
    好抓狂啊,写的代码没问题的,但是ie6-8就是运行脚本错误,已经放了jq1.7了,这么低版本应该兼容啊。大神能否写个这段代码原生的js,就在3楼的基础上改下就行,加上去多余空格和回车跳转到点击a标签,拜托了,上面催我交差额...
      

  4.   

    是不是应该这样写。
    <!--[if lt IE 7] 
    <script src="jquery-1.7.2.min.js"></script>
    <![endif]-->
    <!--[if lt IE 9] 
    <script src="jquery-1.10.1.min.js"></script>
    <![endif]-->
    <!--[if gte IE 9] 
    <script src="jquery-2.0.2.min.js"></script>
    <![endif]-->
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>无标题文档</title>
      <style>
        input{border:none;background:none;float:left;padding:0;margin:0;}
        .search{width:350px;height:38px;border:solid 1px #000;margin:100px auto;}
        .search .sText{width:300px;height:38px;line-height:38px;font-size:14px;}
        .search .sBtn{width:50px;height:38px;background:red;text-align:center;color:#fff;font-size:14px; cursor:pointer;}
      </style>
      <script>
        window.onload=function()
        {
          var oText=document.getElementById('sText');
          var oBtn=document.getElementById('sBtn');
          oBtn.onclick=function()
          {
            var vali = oText.value.Trim();
            alert(vali)
          }
          oText.onkeypress=function(ev)
          {
            var ev=ev||event;
            if(ev.keyCode==13||ev.which==13)
            {
              oBtn.onclick();
            }
          }
        }
        String.prototype.Trim = function()    
        {    
          return this.replace(/(^\s*)|(\s*$)/g, "");    
        } 
      </script>
    </head><body>
      <div class="search">
        <input type="text" class="sText" id="sText"/>
        <input type="button" class="sBtn" id="sBtn" value="搜索" />
      </div>
    </body>
    </html>
      

  6.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
    input{border:none;background:none;float:left;padding:0;margin:0;}
    .search{width:350px;height:38px;border:solid 1px #000;margin:100px auto;}
    .search .sText{width:300px;height:38px;line-height:38px;font-size:14px;}
    .search .sBtn{width:50px;height:38px;background:red;text-align:center;color:#fff;font-size:14px; cursor:pointer;}
    </style>
    <script>
    window.onload=function()
    {
    var oText=document.getElementById('sText');
    var oBtn=document.getElementById('sBtn');
    oBtn.onclick=function()
    {
    alert(trim(oText.value));
    }
    oText.onkeypress=function(ev)
    {
    var ev=ev||event;
    if(ev.keyCode==13||ev.which==13)
    {
    //alert(oText.value);
    oBtn.click();//调用搜索点击
    }
    }
    }
    //清除左右空格
    function trim(value)
    {
    return value.replace(/^\s+|\s+$/g,'');
    }
    </script>
    </head><body>
    <div class="search">
    <input type="text" class="sText" id="sText"/>
        <input type="button" class="sBtn" id="sBtn" value="搜索" />
    </div>
    </body>
    </html>
      

  7.   

    Quote: 引用 9 楼 microlab2009 的回复:

    搞定了,感谢大神!!!
    回头我再好好学学js!