2016-03-02 9 views
5

वेब बनाने के दौरान मुझे बूटस्ट्रैप मोडल में "इनपुट" में फोकस नहीं मिला, मैंने सब कुछ करने की कोशिश की और काम नहीं किया, मोडल दिखाई देता है लेकिन इनपुट फोकस नहीं करता है। मैंने एक साधारण मोडल के साथ "test.php" बनाया है और यह भी काम नहीं करता है। यहाँ "test.php"बूटस्ट्रैप मॉडल फोकस काम नहीं कर रहा

<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 सर्वर पर कोशिश है, लेकिन अगर मैं "बेला पर एक ही कोड डाल ", ठीक काम करता है।

क्या गलत है इसका कोई विचार? अगर मुझे कुछ और चाहिए ... या सर्वर में कुछ स्थापित करें।

पी.डी. मेरी अंग्रेजी के लिए खेद है।

+0

हो सकता है कि आपके ब्राउज़र jQuery नहीं मिला .min.js ?! यदि आप अपने ब्राउज़र को एफ 12/डेवलपर टूल/फायरबग के साथ खोलते हैं, तो क्या आपको नेटवर्क व्यू में लाल प्रविष्टियां दिखाई देती हैं? – Varon

+0

यह वही है जो मैं कर रहा था, यहां यह कहता है: त्रुटि: बूटस्ट्रैप की जावास्क्रिप्ट को jQuery की आवश्यकता है .. लेकिन संग्रह वहां है। लोड क्यों नहीं हो रहा है? – teikuei

+0

यदि मैं क्रोम पर कोशिश करता हूं तो यह काम करता है ... फ़ायरफ़ॉक्स का कुछ होना चाहिए। पागल हो रहा था। फ़ायरफ़ॉक्स के साथ समस्या क्या हो सकती है? अभी तक ठीक काम कर रहा था। – teikuei

उत्तर

18

प्रयास करें इस (ऑटोफोकस अपने लिंक को जोड़ा गया):

<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(); 
}); 
+0

मेरे लिए दूसरा विकल्प काम किया। धन्यवाद – cralfaro

+0

धन्यवाद, यह मेरा दिन बनाते हैं। :) एक आकर्षण की तरह काम करना –

+0

विशेष रूप से jquery फ़ंक्शन हमेशा ऑटोफोकस की तरह। यदि उपयोगकर्ता गलती से मोडल बंद कर देता है तो यूएक्स स्थिर बनाता है। – Michael

संबंधित मुद्दे