使用jQuery焦点和模糊显示和隐藏消息

Question

I am clicking to set focus on a textbox , and once I have set focus I am trying to display a simple message. 我单击以将focus设置在textbox ，一旦设置了焦点，我将尝试显示一条简单的消息。 Then on blur that message disappears. 然后在blur该消息消失。

Here is my code: If I click on the textbox it displays the message but if I click the button it doesn't set focus as I thought it would. 这是我的代码：如果单击textbox它将显示消息，但是如果单击按钮，则不会按我预期的那样设置焦点。

<script>
$(document).ready(function(){    
  $("#clicker").click(function(){        
    $("#T1").focus(function(){            
      $("#myFocus").show();        
    });     
  });        

  $("#T1").blur(function(){        
    $("#myFocus").hide();    
  });
});
</script>

<body>
<div id="clicker" style="cursor:pointer; border:1px solid black; width:70px;">
  Click here!
</div>
<br /><br />
<input id="T1" name="Textbox" type="text" />
<div id="myFocus" style="display: none;">focused!</div>

Answer 1

You need to trigger the focus event, instead of defining it. 您需要触发焦点事件，而不是对其进行定义。 Try this instead: 尝试以下方法：

<script>
$(function() { // Shorthand for $(document).ready(function() {
      $('#clicker').click(function() {
            $('#T1').focus(); // Trigger focus
      });

      $('#T1').focus(function() { // Define focus handler
            $('#myFocus').show();
      }).blur(function() {
            $('#myFocus').hide();
      });
});
</script>

Answer 2

The problem is here: 问题在这里：

$("#T1").focus(function(){            
      $("#myFocus").show();        
});

You should trigger the event with focus() not attach a callback with focus(function(){...} 您应该使用focus()触发事件，而不要使用focus(function(){...}附加回调

Fixed code: 固定代码：

$(document).ready(function(){    
  $("#clicker").click(function(){        
        $('#T1').focus();
  });        

  $("#T1").blur(function(){        
      $("#myFocus").hide();    
  })     .focus(funcion(){
              $("#myFocus").show();        
          });
});

使用jQuery焦点和模糊显示和隐藏消息

问题描述

2 个解决方案

解决方案1
4 已采纳 2012-02-09 05:53:43

解决方案2
1 2012-02-09 05:56:32

使用jQuery焦点和模糊显示和隐藏消息

问题描述

2 个解决方案

解决方案1 4 已采纳 2012-02-09 05:53:43

解决方案2 1 2012-02-09 05:56:32

解决方案1
4 已采纳 2012-02-09 05:53:43

解决方案2
1 2012-02-09 05:56:32