Bootstrap Modal Focus not working

制作网页时我没有将注意力集中在Bootstrap Modal的“输入”中，我尝试了所有内容并且没有工作，模态出现但输入未获得焦点。我用一个简单的模式创建了一个“test.php”，但也不起作用。这里是“test.php的”Bootstrap Modal Focus not working

<html lang="es"> 

<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 


    <link href="../css/bootstrap.min.css" rel="stylesheet"> 
    <script src="../js/jquery.min.js"></script> 
    <script src="../js/bootstrap.min.js"> 



    <script> 


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


    </script> 

</head> 
<body> 
<!-- Button trigger modal --> 
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
    Launch demo modal 
</button> 

<!-- Modal --> 
<div class="modal fade" id="myModal"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
     <input name="referencia" id="referencia" type="text" class="form-control text-uppercase" placeholder="Descripci&oacute;n"> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 
</body>

如果我尽我的服务器上的代码它不工作，unelink.es服务器上也不管用，但如果我把相同的代码上“小提琴“，工作正常。

任何想法是什么错？如果我需要别的东西......或者在服务器上安装某些东西。

P.D.对不起我的英语不好。

来源

2016-03-02 teikuei

也许你的浏览器没有找到的jQuery .min.js？如果您使用F12/developer tools/firebug打开浏览器，您是否在网络视图中看到红色条目？ – Varon

这就是我正在做的事情，它是这样说的：错误：Bootstrap的JavaScript需要jQuery ..但存档在那里。为什么不加载？ – teikuei

如果我尝试在Chrome上工作......一定是Firefox的东西。正在变得疯狂。什么是Firefox的问题？一直工作良好，直到现在。 – teikuei

试试这个（自动对焦添加到您的链接）：

<input name="referencia" id="referencia" type="text" class="form-control text-uppercase" placeholder="Descripci&oacute;n" autofocus>

或试试这个：

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

或本：

// Every time a modal is shown, if it has an autofocus element, focus on it. 
$('.modal').on('shown.bs.modal', function() { 
    $(this).find('[autofocus]').focus(); 
});

来源

2016-03-04 20:51:31 JoeyG

对于我来说，第二种方法是工作的。谢谢 – cralfaro

谢谢，这使我的一天。 :)像魅力一样工作 –

尤其像jquery函数一直自动对焦。如果用户意外关闭模态，则使UX保持不变。 – Michael

Bootstrap Modal Focus not working

回答

相关问题