Nejde psát do inputu – HTML / XHTML – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Nejde psát do inputu – HTML / XHTML – Fórum – Programujte.comNejde psát do inputu – HTML / XHTML – Fórum – Programujte.com

 

Toto vlákno bylo označeno za vyřešené.
Matěj Andrle+1
Grafoman
29. 5. 2014   #1
-
0
-

Dobrý den:

<body>

	<div id="container">

		<header role="page-header">

			<div id="slideA"></div>
			<div id="slideB"></div>

		</header>

		<section>

			<aside>

				<form action="place.php" method="GET" id="selector">

					<input name="country" type="text" placeholder="Country of your ad" />

					<ul id="list" tabindex="1"></ul>

				</form>

			</aside>

			<article>

				<h2>The main objective</h2>

				<p>Internet contains lots of ad. But really lots of. Therefore this site exists. You no longer need to look for long hours, now just a minute!</p>

			</article>
		</section>
	</div>
</body>
*
{
	border: 0;
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	font-family: "wf_SegoeUI", "Segoe UI", "Segoe", "Segoe WP", "Tahoma", "Verdana", "Arial", "sans-serif";
}

body
{
	color: white;
	font-size: 18px;
	background: #3E3E3E url(back.jpg);
}

#container
{
	width: 1100px;
	margin: 0 auto;
	box-shadow: 0px 5px 20px 5px rgba(0, 0, 0, 0.5);
}

header[role="page-header"]
{
	display: block;
	position: relative;
}

header[role="page-header"] div
{
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	position: absolute;
	background-size: 100% 100%;
}

header[role="page-header"],
header[role="page-header"] div
{
	width: 1100px;
	height: 300px;
}

section
{
	padding: 20px;
	background-color: #202020;
}

aside
{
	float: right;
	width: 400px;
}

#selector
{
	display: inline-block;
	position: relative;
}

#list
{
	left: 0;
	right: 0;
	top: 50px;
	display: none;
	font-size: 1.1em;
	padding: 0 20px;
	text-align: center;
	position: absolute;
	background-color: white;
}

#list li
{
	text-decoration: none;
	color: #202020;
	list-style: none;
}

#list li:hover
{
	text-decoration: underline;
	cursor: pointer;
}

article
{
	padding: 20px;
	width: 500px;
}

input, h1, h2, h3, h4, h5, h6
{
	color: #F62459;
}

input, h1 { font-size: 1.4em }

h2 { font-size: 1.2em }

p
{
	padding: 10px;
	text-align: justify;
	text-indent: 40px;
}

input
{
	padding: 10px;
	text-align: center;
	background-color: black;
	border: 1px solid #202020;
}


V JS mám udělané automatické doplňování do inputu - a to pomocí ul. (jedenotlivá li jsou možností doplnění) Mám ohandlovaný event keypress a nic se při psaní nespustí - co húř, input vstup ignoruje - ve Firefoxu mi to háže funkci hledání na stránci při psaní... Co s tím?
Děkuji.

Nahlásit jako SPAM
IP: 78.136.144.–
Ericsko+3
Stálý člen
29. 5. 2014   #2
-
0
-

Skus sem hodit aj ten js

Nahlásit jako SPAM
IP: 88.212.34.–
Matěj Andrle+1
Grafoman
29. 5. 2014   #3
-
0
-

   

var
	list,
	index,
	selector,
	country,
	countries =
	[
		"Afghanistan",
		"Albania",
		"Algeria",
		"Andorra",
		"Angola",
		"Antigua and Barbuda",
		"Argentina",
		"Armenia",
		"Australia",
		"Austria",
		"Azerbaijan",
		"The Bahamas",
		"Bahrain",
		"Bangladesh",
		"Barbados",
		"Belarus",
		"Belgium",
		"Belize",
		"Benin",
		"Bhutan",
		"Bolivia",
		"Bosnia and Herzegovina",
		"Botswana",
		"Brazil",
		"Britain",
		"Brunei",
		"Bulgaria",
		"Burkina Faso",
		"Burundi",
		"Burma",
		"Cambodia",
		"Cameroon",
		"Canada",
		"Cape Verde",
		"Central African Republic",
		"Chad",
		"Chile",
		"China",
		"Colombia",
		"Comoros",
		"Democratic Republic of the Congo",
		"Costa Rica",
		"Cote D'Ivoire",
		"Croatia",
		"Cuba",
		"Cyprus",
		"Czech Republic",
		"Czechoslovakia",
		"Denmark",
		"Djibouti",
		"Dominica",
		"Dominican Republic",
		"Ecuador",
		"Egypt",
		"El Salvador",
		"England",
		"Equatorial Guinea",
		"Eritrea",
		"Estonia",
		"Ethiopia",
		"Fiji",
		"Finland",
		"France",
		"Gabon",
		"The Gambia",
		"Georgia",
		"Germany",
		"Ghana",
		"Great Britain",
		"Greece",
		"Greenland",
		"Grenada",
		"Guatemala",
		"Guinea",
		"Guinea-Bissau",
		"Guyana",
		"Haiti",
		"Honduras",
		"Hungary",
		"Iceland",
		"India",
		"Indonesia",
		"Iran",
		"Iraq",
		"Ireland",
		"Northern Ireland",
		"Israel",
		"Italy",
		"Jamaica",
		"Japan",
		"Java",
		"Jordan",
		"Kazakhstan",
		"Kenya",
		"Kiribati",
		"North Korea",
		"South Korea",
		"Kuwait",
		"Kyrgyzstan",
		"Laos",
		"Latvia",
		"Lebanon",
		"Lesotho",
		"Liberia",
		"Libya",
		"Liechtenstein",
		"Lithuania",
		"Luxembourg",
		"Macedonia",
		"Madagascar",
		"Malawi",
		"Malaysia",
		"Maldives",
		"Mali",
		"Malta",
		"Marshall Islands",
		"Mauritania",
		"Mauritius",
		"Mexico",
		"Micronesia",
		"Moldova",
		"Monaco",
		"Mongolia",
		"Morocco",
		"Mozambique",
		"Myanmar (Burma)",
		"Namibia",
		"Nauru",
		"Nepal",
		"The Netherlands",
		"New Zealand",
		"Nicaragua",
		"Niger",
		"Nigeria",
		"North Korea",
		"Norway",
		"Northern Ireland",
		"Oman",
		"Pakistan",
		"Palau",
		"Panama",
		"Papua New Guinea",
		"Paraguay",
		"Peru",
		"The Philippines",
		"Poland",
		"Portugal",
		"Qatar",
		"Romania",
		"Russia",
		"Rwanda",
		"St. Kitts and Nevis",
		"St. Lucia",
		"St. Vincent and the Grenadines",
		"Samoa",
		"San Marino",
		"Sao Tome and Principe",
		"Saudi Arabia",
		"Scotland",
		"Senegal",
		"Seychelles",
		"Sierra Leone",
		"Singapore",
		"Slovakia",
		"Slovenia",
		"Solomon Islands",
		"Somalia",
		"South Africa",
		"South Korea",
		"Spain",
		"Sri Lanka",
		"Sudan",
		"Suriname",
		"Swaziland",
		"Sweden",
		"Switzerland",
		"Syria",
		"Taiwan",
		"Tajikistan",
		"Tanzania",
		"Thailand",
		"Togo",
		"Tonga",
		"Trinidad and Tobago",
		"Tunisia",
		"Turkey",
		"Turkmenistan",
		"Tuvalu",
		"Uganda",
		"Ukraine",
		"United Arab Emirates",
		"United Kingdom",
		"United States",
		"Uruguay",
		"Uzbekistan",
		"Vanuatu",
		"Vatican City",
		"Venezuela",
		"Vietnam",
		"Wales",
		"Yemen",
		"Yugoslavia",
		"Zambia",
		"Zimbabwe",
	];

window.onload = function()
{
	country = document.getElementsByName("country")[0];
	selector = document.getElementById("selector");
	list = document.getElementById("list");

	Loader.init();
	Slideshow.init();

	list.onblur = function()
	{
		list.style.display = "none";
	};

	country.onkeypress = function()
	{
		autocomplete();
		list.style.display = "block";
		list.focus();
	};
};

function autocomplete()
{
	list.style.display = "none";
	list.innerHTML = "";

	for(index in countries)
		if(countries[index].toLowerCase().indexOf(country.value.toLowerCase()) != -1)
			list.innerHTML += "<li>" + countries[index] + "</li>";
}
Nahlásit jako SPAM
IP: 78.136.144.–
peter
~ Anonymní uživatel
4014 příspěvků
30. 5. 2014   #4
-
0
-

list.focus(); // cokoliv napises, tak presune focus do listu ul/li a tim padem uz nelze psat dal

//    Loader.init(); - undefined
//    Slideshow.init(); - undefined

        if(countries[index].toLowerCase().indexOf(country.value.toLowerCase()) != -1) // 0, -1 je chapano jako false, takze, pokud to zacina tim stringem, tak to nemusi najit, dokud tam nedas !==. Ale pri mem testovani to fungovalo spravne, takze si teto poznamky nevsimej...

    country.onkeypress = function()
    {
        autocomplete();
        list.style.display = "block";
        list.focus();
    };
// tady nemas vubec zadne return. Zmacknuti klavesy je casova udalost, ktera nejaky cast trva nezavisle od dalsiho js. Po uplynuti tohoto casu se teprve zapise pismenko do policka. Pokud se ten js stihne vykonat ale drive, tak pracuje jeste sprazdnym polickem. Navic, v tomto pripade to funguje tak, ze se zmacknuta klavesa nejspis zapise do policka az po vykonani js, pokud je vysledkem funkce true (return true) (pokud se jiz nezapsala pri onkeydown, ovsem). Pokud tam neuvedes nic, chape se to jako return true. Schvalne si zkus napsat do input policka treba "a". Mozna se to rozbali, mozna ne. A ted na to input znova klikni a pripis k tomu "b", takze by tam melo byt "ab". Ale moznosti se rozbali pro vsechno obsahujici "a" i uprostred slova.
Kdyz pismenko odmazes, tak je to take klavesa, ale nejak to nereaguje :)

 

Nahlásit jako SPAM
IP: 2001:718:2601:258:ccf2:d5...–
peter
~ Anonymní uživatel
4014 příspěvků
30. 5. 2014   #5
-
0
-

nejaky cast trva
*nejaky cas trva

Nahlásit jako SPAM
IP: 2001:718:2601:258:ccf2:d5...–
Matěj Andrle+1
Grafoman
30. 5. 2014   #6
-
0
-

Kdepak - chyba byla pouze ve focusu - protože ho dostal list i nerozbalený - pořešil jsem to přehazováním si focusu...

var
	list,
	index,
	selector,
	country,
	countries =
	[
		"Afghanistan",
		"Africa",
		"Aland Islands",
		"Albania",
		"Algeria",
		"American Samoa",
		"Andorra",
		"Angola",
		"Anguilla",
		"Antarctica",
		"Antigua & Barbuda",
		"Argentina",
		"Armenia",
		"Aruba",
		"Asia",
		"Australia",
		"Austria",
		"Azerbaijan",
		"Bahamas, The",
		"Bahrain",
		"Bangladesh",
		"Barbados",
		"Belarus",
		"Belgium",
		"Belize",
		"Benin",
		"Bermuda",
		"Bhutan",
		"Bolivia",
		"Bonaire, St.Eustat, Saba",
		"Bosnia and Herzegovina",
		"Botswana",
		"Bouvet Island",
		"Brazil",
		"British Indian Ocean T.",
		"British Virgin Islands",
		"Brunei Darussalam",
		"Bulgaria",
		"Burkina Faso",
		"Burundi",
		"Cambodia",
		"Cameroon",
		"Canada",
		"Cape Verde",
		"Caribbean, the",
		"Cayman Islands",
		"Central African Republic",
		"Central America",
		"Chad",
		"Chile",
		"China",
		"Christmas Island",
		"Cocos (Keeling) Islands",
		"Colombia",
		"Comoros",
		"Congo",
		"Congo, Dem. Rep. of the",
		"Cook Islands",
		"Costa Rica",
		"Cote D'Ivoire",
		"Croatia",
		"Cuba",
		"Cyprus",
		"Czech Republic",
		"Denmark",
		"Djibouti",
		"Dominica",
		"Dominican Republic",
		"East Timor (Timor-Leste)",
		"Ecuador",
		"Egypt",
		"El Salvador",
		"Equatorial Guinea",
		"Eritrea",
		"Estonia",
		"Ethiopia",
		"Europe",
		"European Union",
		"Falkland Is. (Malvinas)",
		"Faroe Islands",
		"Fiji",
		"Finland",
		"France",
		"French Guiana",
		"French Polynesia",
		"French Southern Terr.",
		"Gabon",
		"Gambia, the",
		"Georgia",
		"Germany",
		"Ghana",
		"Gibraltar",
		"Greece",
		"Greenland",
		"Grenada",
		"Guadeloupe",
		"Guam",
		"Guatemala",
		"Guernsey and Alderney",
		"Guiana, French",
		"Guinea",
		"Guinea-Bissau",
		"Guinea, Equatorial",
		"Guyana",
		"Haiti",
		"Heard & McDonald Is.(AU)",
		"Holy See (Vatican)",
		"Honduras",
		"Hong Kong, (China)",
		"Hungary",
		"Iceland",
		"India",
		"Indonesia",
		"Iran, Islamic Republic of",
		"Iraq",
		"Ireland",
		"Israel",
		"Italy",
		"Ivory Coast (Cote d'Ivoire)",
		"Jamaica",
		"Japan",
		"Jersey",
		"Jordan",
		"Kazakhstan",
		"Kenya",
		"Kiribati",
		"Korea Dem. People's Rep.",
		"Korea, (South) Republic of",
		"Kosovo",
		"Kuwait",
		"Kyrgyzstan",
		"Lao People's Democ. Rep.",
		"Latvia",
		"Lebanon",
		"Lesotho",
		"Liberia",
		"Libyan Arab Jamahiriya",
		"Liechtenstein",
		"Lithuania",
		"Luxembourg",
		"Macao, (China)",
		"Macedonia, TFYR",
		"Madagascar",
		"Malawi",
		"Malaysia",
		"Maldives",
		"Mali",
		"Malta",
		"Man, Isle of",
		"Marshall Islands",
		"Martinique (FR)",
		"Mauritania",
		"Mauritius",
		"Mayotte (FR)",
		"Mexico",
		"Micronesia, Fed. States of",
		"Middle East",
		"Moldova, Republic of",
		"Monaco",
		"Mongolia",
		"Montenegro",
		"Montserrat",
		"Morocco",
		"Mozambique",
		"Myanmar (ex-Burma)",
		"Namibia",
		"Nauru",
		"Nepal",
		"Netherlands",
		"Netherlands Antilles",
		"New Caledonia",
		"New Zealand",
		"Nicaragua",
		"Niger",
		"Nigeria",
		"Niue",
		"Norfolk Island",
		"North America",
		"Northern Mariana Islands",
		"Norway",
		"Oceania",
		"Oman",
		"Pakistan",
		"Palau",
		"Palestinian Territory",
		"Panama",
		"Papua New Guinea",
		"Paraguay",
		"Peru",
		"Philippines",
		"Pitcairn Island",
		"Poland",
		"Portugal",
		"Puerto Rico",
		"Qatar",
		"Reunion (FR)",
		"Romania",
		"Russia (Russian Fed.)",
		"Rwanda",
		"Sahara, Western",
		"Saint Barthelemy (FR)",
		"Saint Helena (UK)",
		"Saint Kitts and Nevis",
		"Saint Lucia",
		"Saint Martin (FR)",
		"S Pierre & Miquelon(FR)",
		"S Vincent & Grenadines",
		"Samoa",
		"San Marino",
		"Sao Tome and Principe",
		"Saudi Arabia",
		"Senegal",
		"Serbia",
		"Seychelles",
		"Sierra Leone",
		"Singapore",
		"Slovakia",
		"Slovenia",
		"Solomon Islands",
		"Somalia",
		"South Africa",
		"South America",
		"S.George & S.Sandwich",
		"South Sudan",
		"Spain",
		"Sri Lanka (ex-Ceilan)",
		"Sudan",
		"Suriname",
		"Svalbard & Jan Mayen Is.",
		"Swaziland",
		"Sweden",
		"Switzerland",
		"Syrian Arab Republic",
		"Taiwan",
		"Tajikistan",
		"Tanzania, United Rep. of",
		"Thailand",
		"Timor-Leste (East Timor)",
		"Togo",
		"Tokelau",
		"Tonga",
		"Trinidad & Tobago",
		"Tunisia",
		"Turkey",
		"Turkmenistan",
		"Turks and Caicos Is.",
		"Tuvalu",
		"Uganda",
		"Ukraine",
		"United Arab Emirates",
		"United Kingdom",
		"United States",
		"US Minor Outlying Isl.",
		"Uruguay",
		"Uzbekistan",
		"Vanuatu",
		"Vatican (Holy See)",
		"Venezuela",
		"Viet Nam",
		"Virgin Islands, British",
		"Virgin Islands, U.S.",
		"Wallis and Futuna",
		"Western Sahara",
		"Yemen",
		"Zambia",
		"Zimbabwe"
	];

window.onload = function()
{
	selector = document.getElementById("selector");
	country = document.getElementById("country");
	list = document.getElementById("list");

	Loader.init();
	Slideshow.init();

	list.onmouseover = function()
	{
		country.onblur = null;
		list.focus();
		country.onblur = list.onblur;
	};

	country.onmouseover = function()
	{
		list.onblur = null;
		country.focus();

		list.onblur = function()
		{
			list.style.display = "none";
		};

		country.onblur = list.onblur;
	};

	country.onkeyup = function()
	{
		autocomplete();
	};
};

function autocomplete()
{
	list.style.display = "none";

	if(country.value)
	{
		list.innerHTML = "";

		for(index in countries)
			if(countries[index].toLowerCase().indexOf(country.value.toLowerCase()) != -1)
				list.innerHTML += "<li><a href=\"place.php?c=" + index + "\">" + countries[index] + "</li>";

		if(list.innerHTML)
			list.style.display = "block";
	}
}

Toto mi zajišťuje, že se po každém kliku mimo list a input list zabalí, ale jiné kliky přežije...

Nahlásit jako SPAM
IP: 78.136.147.–
Matěj Andrle+1
Grafoman
30. 5. 2014   #7
-
0
-

Bez focusu by nešel event blur - a tak bych neměl jak zabalit list při kliku mimo... (standardní chování)

Nahlásit jako SPAM
IP: 78.136.147.–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 4 hosté

Podobná vlákna

Velkost INPUTu — založil marioff

Kombinace inputů — založil Caterpillar

Sečtění dvou inputů — založil tommassino

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý