在自举模式中自动对焦输入

时间:2015-07-09 13:49:05

标签: css twitter-bootstrap-3

我使用bootstrap 3来创建一个模态框。我希望autofocus区域有input。我试过jQuery,但我不知道,问题是什么?

JavaScript的:

$('#click').click(function () {
    $('input').focus()
});

这是demo on JSFiddle

2 个答案:

答案 0 :(得分:2)

这可能是硬编码,但添加了一个超时功能来聚焦它 事实上,模态还没有在这里,所以浏览器无法将元素集中在其中。

Compiling REx "((\w)\2*)"
Final program:
   1: OPEN1 (3)
   3:   OPEN2 (5)
   5:     POSIXD[\w] (6)
   6:   CLOSE2 (8)
   8:   CURLYX[2] {0,32767} (13)
  10:     REF2 (12)
  12:   WHILEM[1/1] (0)
  13:   NOTHING (14)
  14: CLOSE1 (16)
  16: END (0)
stclass POSIXD[\w] minlen 1 
Matching REx "((\w)\2*)" against "aabcccccaaaaaaa"
Matching stclass POSIXD[\w] against "aabcccccaaaaaaa" (15 bytes)
   0 <> <aabcccccaa>         |  1:OPEN1(3)
   0 <> <aabcccccaa>         |  3:OPEN2(5)
   0 <> <aabcccccaa>         |  5:POSIXD[\w](6)
   1 <a> <abcccccaaa>        |  6:CLOSE2(8)
   1 <a> <abcccccaaa>        |  8:CURLYX[2] {0,32767}(13)
   1 <a> <abcccccaaa>        | 12:  WHILEM[1/1](0)
                                    whilem: matched 0 out of 0..32767
   1 <a> <abcccccaaa>        | 10:    REF2: "a"(12)
   2 <aa> <bcccccaaaa>       | 12:    WHILEM[1/1](0)
                                      whilem: matched 1 out of 0..32767
   2 <aa> <bcccccaaaa>       | 10:      REF2: "a"(12)
                                        failed...
                                      whilem: failed, trying continuation...
   2 <aa> <bcccccaaaa>       | 13:      NOTHING(14)
   2 <aa> <bcccccaaaa>       | 14:      CLOSE1(16)
   2 <aa> <bcccccaaaa>       | 16:      END(0)
Match successful!
Matching REx "((\w)\2*)" against "bcccccaaaaaaa"
Matching stclass POSIXD[\w] against "bcccccaaaaaaa" (13 bytes)
   2 <aa> <bcccccaaaa>       |  1:OPEN1(3)
   2 <aa> <bcccccaaaa>       |  3:OPEN2(5)
   2 <aa> <bcccccaaaa>       |  5:POSIXD[\w](6)
   3 <aab> <cccccaaaaa>      |  6:CLOSE2(8)
   3 <aab> <cccccaaaaa>      |  8:CURLYX[2] {0,32767}(13)
   3 <aab> <cccccaaaaa>      | 12:  WHILEM[1/1](0)
                                    whilem: matched 0 out of 0..32767
   3 <aab> <cccccaaaaa>      | 10:    REF2: "b"(12)
                                      failed...
                                    whilem: failed, trying continuation...
   3 <aab> <cccccaaaaa>      | 13:    NOTHING(14)
   3 <aab> <cccccaaaaa>      | 14:    CLOSE1(16)
   3 <aab> <cccccaaaaa>      | 16:    END(0)
Match successful!
Matching REx "((\w)\2*)" against "cccccaaaaaaa"
Matching stclass POSIXD[\w] against "cccccaaaaaaa" (12 bytes)
   3 <aab> <cccccaaaaa>      |  1:OPEN1(3)
   3 <aab> <cccccaaaaa>      |  3:OPEN2(5)
   3 <aab> <cccccaaaaa>      |  5:POSIXD[\w](6)
   4 <aabc> <ccccaaaaaa>     |  6:CLOSE2(8)
   4 <aabc> <ccccaaaaaa>     |  8:CURLYX[2] {0,32767}(13)
   4 <aabc> <ccccaaaaaa>     | 12:  WHILEM[1/1](0)
                                    whilem: matched 0 out of 0..32767
   4 <aabc> <ccccaaaaaa>     | 10:    REF2: "c"(12)
   5 <aabcc> <cccaaaaaaa>    | 12:    WHILEM[1/1](0)
                                      whilem: matched 1 out of 0..32767
   5 <aabcc> <cccaaaaaaa>    | 10:      REF2: "c"(12)
   6 <abccc> <ccaaaaaaa>     | 12:      WHILEM[1/1](0)
                                        whilem: matched 2 out of 0..32767
   6 <abccc> <ccaaaaaaa>     | 10:        REF2: "c"(12)
   7 <bcccc> <caaaaaaa>      | 12:        WHILEM[1/1](0)
                                          whilem: matched 3 out of 0..32767
   7 <bcccc> <caaaaaaa>      | 10:          REF2: "c"(12)
   8 <ccccc> <aaaaaaa>       | 12:          WHILEM[1/1](0)
                                            whilem: matched 4 out of 0..32767
   8 <ccccc> <aaaaaaa>       | 10:            REF2: "c"(12)
                                              failed...
                                            whilem: failed, trying continuation...
   8 <ccccc> <aaaaaaa>       | 13:            NOTHING(14)
   8 <ccccc> <aaaaaaa>       | 14:            CLOSE1(16)
   8 <ccccc> <aaaaaaa>       | 16:            END(0)
Match successful!
Matching REx "((\w)\2*)" against "aaaaaaa"
Matching stclass POSIXD[\w] against "aaaaaaa" (7 bytes)
   8 <ccccc> <aaaaaaa>       |  1:OPEN1(3)
   8 <ccccc> <aaaaaaa>       |  3:OPEN2(5)
   8 <ccccc> <aaaaaaa>       |  5:POSIXD[\w](6)
   9 <ccccca> <aaaaaa>       |  6:CLOSE2(8)
   9 <ccccca> <aaaaaa>       |  8:CURLYX[2] {0,32767}(13)
   9 <ccccca> <aaaaaa>       | 12:  WHILEM[1/1](0)
                                    whilem: matched 0 out of 0..32767
   9 <ccccca> <aaaaaa>       | 10:    REF2: "a"(12)
  10 <cccccaa> <aaaaa>       | 12:    WHILEM[1/1](0)
                                      whilem: matched 1 out of 0..32767
  10 <cccccaa> <aaaaa>       | 10:      REF2: "a"(12)
  11 <cccccaaa> <aaaa>       | 12:      WHILEM[1/1](0)
                                        whilem: matched 2 out of 0..32767
  11 <cccccaaa> <aaaa>       | 10:        REF2: "a"(12)
  12 <cccccaaaa> <aaa>       | 12:        WHILEM[1/1](0)
                                          whilem: matched 3 out of 0..32767
  12 <cccccaaaa> <aaa>       | 10:          REF2: "a"(12)
  13 <cccccaaaaa> <aa>       | 12:          WHILEM[1/1](0)
                                            whilem: matched 4 out of 0..32767
  13 <cccccaaaaa> <aa>       | 10:            REF2: "a"(12)
  14 <cccccaaaaaa> <a>       | 12:            WHILEM[1/1](0)
                                              whilem: matched 5 out of 0..32767
  14 <cccccaaaaaa> <a>       | 10:              REF2: "a"(12)
  15 <cccccaaaaaaa> <>       | 12:              WHILEM[1/1](0)
                                                whilem: matched 6 out of 0..32767
  15 <cccccaaaaaaa> <>       | 10:                REF2: "a"(12)
                                                  failed...
                                                whilem: failed, trying continuation...
  15 <cccccaaaaaaa> <>       | 13:                NOTHING(14)
  15 <cccccaaaaaaa> <>       | 14:                CLOSE1(16)
  15 <cccccaaaaaaa> <>       | 16:                END(0)
Match successful!
Matching REx "((\w)\2*)" against ""
Regex match can't succeed, so not even tried
Freeing REx: "((\w)\2*)"

答案 1 :(得分:2)

我已更新您的JSFiddle。使用引导模式窗口时,您可以使用多个custom events。其中一个是shown.bs.modal在完全显示模态后运行(并且您的输入字段是可聚焦的)。请记住,事件将在模态上触发,而不是在打开模态的任何事件上触发。

$('#myModal').on('shown.bs.modal', function () {
   $('input').focus();
})