Сучасна диджитал-освіта для дітей — безоплатне заняття в GoITeens ×
Mazda CX 5
×

js autocomplete на відстані від форми

Підписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті

Доброго дня! Намагався підставляти різні CSS, але auotocomplete з’являється в іншому місці сторінки, а не є «випадаючий список». Підкажіть, будь ласка, куди і які стилі вставити, щоб він був прив’язаний саме до txtArQuery. Дякую заздалегідь.

<html>
     <head> 
	<title>My autocomplete
	 <br />
	</title>
        <meta charset='utf-8'>
        <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
    </head>
	    <style type="text/css">
body{
background-image: URL("CarteGeografique.jpg");
background-repeat: no-repeat;
background-size: cover;
}
</style>

<body bgcolor="#ffd700" >
	<h1><center>My autocomplete</center></h1>
<h2><center>My autocomplete</center></h2>

<p><center><textarea style="background-color: #96e9c5 ; height: 15%; width: 60%" id="txtArQuery"></textarea></p>
	<p><center><textarea style="background-color: #96e9c5 ; height: 15%; width: 60%" id="txtArQuestion"></textarea></p>
 
<center><button style="height: 10%; width:60%" type="button" id="sndBtn" onclick="Find(this.id)">SEND</button></center>
 <br />


  <script type="text/javascript" src="https://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>
    <script type="text/javascript">


	

document.getElementById("txtArQuestion").style.fontSize = "xx-large";
document.getElementById("txtArQuery").style.fontSize = "xx-large";
document.getElementById("sndBtn").style.fontSize = "xx-large";



var txtAr = document.getElementById("txtArQuestion");
var txtArQuery= document.getElementById("txtArQuery");
var btn = document.getElementById("sndBtn");

var allText;
var questions;
var questCounter=0;
var corrQuestCounter=0;
var wrongQuestCounter=0;
var quest;
var pause=0;
 var questAmount = 10;
 var arrQuestUsed =[questAmount];
 var names;


function readTextFile(file)
{
   
	
}




$(document).ready(function(){
            var data = names;
            $("#txtArQuery").autocomplete(
						
			{
			
	
			source:names
			});
        });

readTextFile("Names.json");


function Find ()
{


}
</script>

 </body>
</html>
👍ПодобаєтьсяСподобалось0
До обраногоВ обраному0
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Рикамендую в будущем пользоваться jsfiddle.net / jsbin.com или еще какой-то онлайновой песочницей, если хочется пошарить простыню неработающего кода.

Спасибо!

Все просто добавьте стили jquery-ui и используйте одинаковые версии jquery и jquery-ui (лично у меня вылезла какая-то ошибка):

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
...
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

P.S.: форматируйте код...

Спасибо огромное! Помогло!

Підписатись на коментарі