Autofokus funktioniert nicht in Textbox von dynamischen Inhalten von AJAX

Ich habe eine Funktion in JS erstellt, die HTML Inhalt durch AJAX bekommt und das im Bootstrap-Dialog setzen.Autofokus funktioniert nicht in Textbox von dynamischen Inhalten von AJAX

Jetzt habe ich hinzugefügt Autofokus Attribut in das Eingabefeld, das in dynamischen HTML kommt. Das Problem ist, dass ich den Fokus auf Eingabefeld für einige Zeit sehe und dann verschwindet.

JS-Code:

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 Funktion nur den dynamischen Inhalt auf den Dialog als HTML hinzuzufügen.

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

HTML-Code von Input:

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

Ich habe auch versucht $('.someInputBox').focus(); Zugabe kurz nach HTML-Inhalte in Bootstrap-Dialog einstellen, kein Glück damit auch.

Gibt es etwas wichtiges, das mir fehlt?

Quelle

2016-06-07 Alok Patel

können Sie den Code von changeDialogContent ?? Hinzufügen einer Geige könnte nützlich sein – SamGhatak

_Das Problem ist, ich sehe den Fokus auf Eingabefeld für irgendwann und dann wird es verschwunden ._.... überprüfen, ob die Seite neu geladen wird. – Jai

@SamGhatak den Code aktualisiert, es ist nur normale Funktion, Inhalt als HTML zu setzen. –

Hier ist mein PHP-Code, die ich .. zu Ihrem Ziel ähnlich sein annehmen würde

test.php:

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

?>

HTML und JavaScript-Code:

<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>

I Bower verwendet Daher sind die Quellpfade von jquery und bootstrap nicht cdn. Und dieser Code funktioniert wirklich gut .. Ich habe keinen Fehler gefunden. Und es tut mir leid, dass ich keine Geige bieten kann, da es eine Serveranfrage und eine Antwort hat. Also habe ich es auf meinem eigenen Rechner getestet.

Und korrigieren Sie mich, wenn ich etwas falsch interpretierte.

Quelle

2016-06-07 10:33:00

Ich möchte nicht das Fokusereignis des Eingabefeldes erfassen, ich möchte nur meinen Cursor in das Textfeld, wenn ich den Dialog öffne. –

in Ordnung alok .. lass mich implementieren .. Ich werde dich in einer Weile zurückholen. –

@Alok Schau mal .. Ich habe keinen Fehler hier .. Ich kann sogar die Screenshots beifügen, wenn Sie möchten. –

Autofokus funktioniert nicht in Textbox von dynamischen Inhalten von AJAX

Antwort

Verwandte Themen