How do I move focus to next input with jQuery?

后端 未结 15 1817
不思量自难忘°
不思量自难忘° 2020-12-04 09:32

I am using the autocomplete plugin with jQuery and it is working fine. However, in IE, when the user selects an item in the autocomplete, the focus does not then move to the

相关标签:
15条回答
  • 2020-12-04 10:18
      function nextFormInput() {
          var focused = $(':focus');
          var inputs = $(focused).closest('form').find(':input');
          inputs.eq(inputs.index(focused) + 1).focus();
      }
    
    0 讨论(0)
  • 2020-12-04 10:22

    I just wrote a jQuery plugin that does what you are looking for (annoyed that that I couldn't find andy solution myself (tabStop -> http://plugins.jquery.com/tabstop/)

    0 讨论(0)
  • 2020-12-04 10:23

    you cat use it

    $(document).on("keypress","input,select",function (e) {
        e.preventDefault();
        if (e.keyCode==13) {
            $(':input:eq(' + ($(':input').index(this) + 1) +')').focus();
        }
    });
    
    0 讨论(0)
  • 2020-12-04 10:27

    Here is what worked in my case. Might be less performance intensive.

    $('#myelement').siblings('input').first().focus();
    
    0 讨论(0)
  • 2020-12-04 10:33

    if you are using event.preventDefault() in your script then comment it out because IE doesn't likes it.

    0 讨论(0)
  • 2020-12-04 10:34

    JQuery UI already has this, in my example below I included a maxchar attribute to focus on the next focus-able element (input, select, textarea, button and object) if i typed in the max number of characters

    HTML:

    text 1 <input type="text" value="" id="txt1" maxchar="5" /><br />
    text 2 <input type="text" value="" id="txt2" maxchar="5" /><br />
    checkbox 1 <input type="checkbox" value="" id="chk1" /><br />
    checkbox 2 <input type="checkbox" value="" id="chk2" /><br />
    dropdown 1 <select id="dd1" >
        <option value="1">1</option>
        <option value="1">2</option>
    </select><br />
    dropdown 2 <select id="dd2">
        <option value="1">1</option>
        <option value="1">2</option>
    </select>
    

    Javascript:

    $(function() {
        var focusables = $(":focusable");   
        focusables.keyup(function(e) {
            var maxchar = false;
            if ($(this).attr("maxchar")) {
                if ($(this).val().length >= $(this).attr("maxchar"))
                    maxchar = true;
                }
            if (e.keyCode == 13 || maxchar) {
                var current = focusables.index(this),
                    next = focusables.eq(current+1).length ? focusables.eq(current+1) : focusables.eq(0);
                next.focus();
            }
        });
    });
    
    0 讨论(0)
提交回复
热议问题