代码之家  ›  专栏  ›  技术社区  ›  Harsha M V

jQuery文本区域焦点

  •  22
  • Harsha M V  · 技术社区  · 14 年前

    当我单击一个按钮时,我希望 textarea 在这个里面 li 要聚焦的元素。

    <li class="commentBlock" id="commentbox-79" style="display: list-item;">
      <div>
        <div class="grid userImageBlockS">
          <div class="imgSmall">
            <img width="35" height="35" alt="image" src="/bakasura1/files/images/small/1288170363aca595cabb50.jpg">
          </div>
        </div>
        <div class="grid userContentBlockS alpha omega"> 
          <form accept-charset="utf-8" action="/bakasura1/account/saveComment" method="post">
            <div style="display: none;">
              <input type="hidden" value="POST" name="_method">
            </div> 
            <input type="hidden" id="StatusMessageReplyPid" value="79" name="data[StatusMessageReply][pid]"> 
            <input type="hidden" id="StatusMessageReplyItemId" value="1" name="data[StatusMessageReply][item_id]"> 
            <input type="hidden" id="StatusMessageReplyCommentersItemId" value="1" name="data[StatusMessageReply][commenters_item_id]"> 
            <textarea id="StatusMessageReplyMessage" name="data[StatusMessageReply][message]">
              Write your comment...
            </textarea>
            <input type="submit" name="" value="Comment" class="comment" id="comment-79">
          </form> 
        </div>
        <div class="clear"></div>
      </div>
    </li>
    

    这是我的 jQuery 代码:

    $('.user-status-buttons').click(function() {
        var id = $(this).attr('id');
        $("#commentbox-"+id).slideToggle("fast");
        $("#commentbox-"+id+" #StatusMessageMessage").focus();
        return false;
    });
    
    3 回复  |  直到 14 年前
        1
  •  26
  •   Horatio Alderaan    14 年前

    根据你对雅各布的回复,也许你想要:

    $('.user-status-buttons').click(function(){
    
        var id = $(this).attr('id');
        $("#commentbox-"+id).slideToggle("fast", function(){
            $("#commentbox-"+id+" #StatusMessageReplyMessage").focus();
        });
    
        return false;
    });
    

    这应该给 #StatusMessageReplyMessage 元素焦点 之后 幻灯片效果已完成。

        2
  •  29
  •   Subin    10 年前

    我使用计时器聚焦文本区域:

    setTimeout(function() {
     $el.find('textarea').focus();
    }, 0);
    
        3
  •  13
  •   dankilev    5 年前

    最简单的解决方案是使用 jQuery focus

      $('#StatusMessageReplyMessage').focus();
    

    注意:如果您在控制台中测试这个,Chrome会将焦点发送回控制台!这可以让你相信它在实际工作完美的时候是不起作用的。只需注意您环境中其他吸引焦点的脚本/行为,一切都会很好:)