自动对焦在来自AJAX的动态内容的文本框中不起作用

我在JS中创建了一个函数，它通过AJAX获取HTML的内容并将其放入引导对话框中。自动对焦在来自AJAX的动态内容的文本框中不起作用

现在我已将自动对焦属性添加到属于动态HTML内的输入框。问题是我看到输入框有一段时间的焦点，然后它消失了。

JS代码：

function getPage(userid) { 
    $.ajax({ 
     type: 'POST', 
     url: PAGE_URL, 
     data: {'userid':userid}, 
     success: function (data) { 
      changeDialogContent(data); 
     }, 
     error: function (e, textStatus) { 
      alert('Error occured while processing your request'); 
     } 
    }); 
}

changeDialogContent功能只有动态内容添加到对话的HTML。输入的

var bootstrapmodal=$('#modelDiv'); 
function changeDialogContent(content) { 
    bootstrapmodal.html(content); 
}

HTML代码：

<input type="text" class="form-control input-sm someInputBox" autofocus="autofocus" value="0" placeholder="Enter Name"/>

我也试过只设置HTML内容为引导对话，与没有运气太后加入$('.someInputBox').focus();。

我错过了什么重要吗？

来源

2016-06-07 Alok Patel

你可以显示changeDialogContent的代码？添加一个小提琴可能是有用的 – SamGhatak

_问题是我看到输入框有一段时间的重点，然后它会消失。检查页面是否重新加载。 – Jai

@SamGhatak更新了代码，它只是将内容设置为HTML的正常功能。 –

这里是我的PHP代码，我认为将类似于你的目标..

test.php的：

<?php 
     echo '<input id="my-input" type="text" class="form-control input-sm someInputBox" autofocus="autofocus" value="0" placeholder="Enter Name"/>'; 

?>

HTML和JavaScript代码：

<html> 
    <head> 
     <script src = "bower_components/jquery/dist/jquery.js"></script> 
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"> 

     <script> 


      function getPage() { 
       $.ajax({ 
        type: 'POST', 
        url: "test.php", 
        data: {}, 
        success: function (data) { 
         changeDialogContent(data); 
          document.getElementById("my-input").focus(); 
        }, 
        error: function (e, textStatus) { 
         alert('Error occured while processing your request'); 
        } 
       }); 
      } 
      function changeDialogContent(content) { 
       $('#modelDiv').html(content); 
      } 

     </script> 
    </head> 
    <body onload="getPage()"> 
     <div id = "modelDiv" class="col-md-3 col-md-offset-4"> 
     </div> 
    </body> 
</html>

我用凉亭所以jquery和bootstrap的源路径不是cdn。而且这段代码工作得很好..我没有遇到任何错误。我很抱歉，我无法提供小提琴，因为它有一个服务器请求和响应..所以我测试了它在我自己的机器上。

纠正我，如果我误解任何东西。

来源

2016-06-07 10:33:00

我不想捕获输入框的焦点事件，当我打开对话框时，我只想将光标放在文本框中。 –

好吧，好吧..让我执行..我会在一段时间内回复你。 –

@Alok看看..我没有错误在这里..我甚至可以附上截图，如果你想。 –

自动对焦在来自AJAX的动态内容的文本框中不起作用

回答

相关问题