JS onclick points

Sekcia o programovaní, programovacích jazykoch...
Používateľov profilový obrázok
Rapidshot
Nový používateľ
Nový používateľ
Príspevky: 33
Dátum registrácie: Ne 12. Júl, 2009, 14:00
Bydlisko: Poloma

JS onclick points

Príspevok od používateľa Rapidshot »

Dobrý deň,
rieším už cez hodinu a pol jednu vec ohľadom Javascriptu no neviem si rady. (Veľmi to neviem ovládať ale potrebujem tu vecičku). Prosím Vás poradte mi ako to spraviť. Čiže:

Mám tento script.

Kód: Vybrať všetko

<script type="text/javascript">
var name = new Array({$name});
var points = new Array({$points}); 

function suggest(str) {
document.getElementById('sugg').style.visibility='hidden';
if (str.length) {
document.getElementById('sugg').innerHTML='';
var r = 0;
for (i = 0; i < name.length; i++) {
if (r < 14 && name[i].substr(0,str.length).toLowerCase() == str.toLowerCase()) {
document.getElementById('sugg').innerHTML+='<a class="suggest_inner" onmouseover="document.getElementById(\'sugg\').style.visibility=\'hidden\'; document.getElementById(\'sugg\').style.visibility=\'visible\'" onclick="document.getElementById(\'inpt\').value=\''+name[i]+'\'; document.getElementById(\'sugg\').style.visibility=\'hidden\'; return false" href="#">'+name[i]+'';
document.getElementById('sugg').style.visibility='visible'
r++;
}	
} 
}
}
if(navigator.userAgent.match(/MSIE 7\.\d+/)) {
var zi = 1000;
$$(".content_block").each(function(block) {
block.style.zIndex = zi--;
});
}
</script>

- premenná $name a $points generuje z php kódu. - tento script slúži nato že keď zadám v inpute meno, pekne mi to pod seba vypíše mená a keď kliknem na meno, ktoré chcem tak sa mi akože uloží do value atď. - lenže potrebujem ku tomu (v daslom riadku) ešte vypísať "$points" .. ciže body, ktoré sú uložené v databáze a do toho array($points); sa ukladajú body: čiže ukážka:

Kód: Vybrať všetko

var name = new Array('','Skuska','Skuska1');
var points = new Array('','10','2'); 
- no a prejdem rovno ku tomu potrebujem spraviť tak že keď kliknem na napr. Skuska tak sa mi zjavia cez html cislo 10. Ked napriklad kliknem na Skuska1 zjavia sa mi body 2. - v html mam to definovane ako id suggp cize v JS nejak tak bude vyzerat.

Kód: Vybrať všetko

document.getElementById('suggp').innerHTML=''+points+'';	
- no lenze s tym si nemozem dat rady ze ked kliknem tak sa mi zjavia tie bodiky.

Dúfam, že ste pochopili. Ak nejaké otázky v pohode sa pýtajte. :) Ďakujem veľmi pekne. Priíjemný zvyšok večera :).
Používateľov profilový obrázok
filuS
Používateľ
Používateľ
Príspevky: 548
Dátum registrácie: Ut 26. Aug, 2008, 13:14
Bydlisko: Presov, Slovakia

Re: JS onclick points

Príspevok od používateľa filuS »

Urcite by som to neriesil takou cestou akou to riesis ty, respektive aspon nie tym tvojim zapisom. Za prve, zbytocne vytvaras dve polia, ktore spolu obsahuju jednu informaciu. Radsej pouzi JSON object, kde klucom bude nazov skusky (predpokladam, ze dve skusky s rovnakym menom sa tam neobjavia) a hodnotou bude pocet bodov z tej danej skusky. Takisto sa vyhnes zapisu ako je "Array({$wtf})" a mozes pouzit php funkciu json_encode(). Popripade mozes pouzit jedno pole, ktoreho prvkami bude object s informaciami.
Druhou vecou je, ze to tam az prilis nahustujes pri vytvarani noveho elementu pre suggestion, je to extremne neprehladne. Radsej si vytvor novy element a potom mu binduj funkcie jednotlive eventy. Urcite sa ti to bude potom lahsie citat, manazovat a lepsie najdes chybu ak mas nieco zle. Vidim kopec chyb v tom tvojom scripte (generujes anchor element, no neuzavries ho; v cykle zbytocne volas "show" nad 'sugg' elementom, staci to raz a to ked skonci cyklus+ten prikaz nemas ani ukonceny bodkociarkou).
Dalsou vecou, co absolutne nechapem je, ze preco pouzivas getElementById a podobne js srandicky, ked tam mas jQuery. Tam to, co potrebujes, urobis lavou zadnou a budes to mat ovela prehladnejsie. V jQuery by ti to fungovalo nejak takto:

Kód: Vybrať všetko

<script type="text/javascript">
	var suggData = {$jsonData};
	
	function suggest(string){
		var $sugg = $("#sugg");
		$sugg.hide();
		if(str.length){
			$sugg.html("");
			var r=0,i=0;
			var $inpt = $("#inpt");
			for(i=0;i<suggData.length;i++){
				if(r<14 && suggData[i].name.toLowerCase()==str.toLowerCase()){
					var $a = $("<a></a>",{"class":"suggest_inner"});
					$a.bind("click mouseover mouseout",function(event){
						if(event.type == "click"){
							$inpt.val(suggData[i].name);
							$("#suggp").html(suggData[i].points);
							$sugg.hide();
							return false;
						} else if(event.type == "mouseover"){
							//wtf, tu som nepochopil, ze naco ti to tam je
						} else {
							//mouseout ...
						}
					});
					$sugg.append($a);
				}
			}
			if(r>0) $sugg.show();
		}
	}
</script>
co sa tyka toho riadku var suggData = {$jsonData}; tak $jsonData je toto:

Kód: Vybrať všetko

$phpData = array(
	array("name"=>"skuska","points"=>10),
	array("name"=>"skuska1","points"=>2),
	array("name"=>"skuska2","points"=>8),
	array("name"=>"skuska3","points"=>3)
);
$jsonData = json_encode($phpData);
snad si to vies predstavit :)
Desktop
Spoiler: ukázať
Specs:
- AMD Ryzen 5 5600X + Noctua NH-U12S Chromax.black
- PowerColor Red Devil AMD Radeon RX 6700XT
- ASUS TUF Gaming B550M-PLUS
- Crucial Ballistix 32GB (4x8GB) 3600 MHz CL16
- Be Quiet! Pure Base 500DX Black + 5x Noctua fans
- Corsair RM650x + CableMod PRO ModMesh C-Series Kabel Kit (Black/Red)
- Samsung 970 EVO Plus 500GB + ADATA XPG SX8200 Pro 1TB
- Sound Blaster Z
OS: Windows 10 Home 64bit
Monitor: Zowie by BenQ XL2546K + Eizo FS2333
Peripherals:
- Logitech G PRO Superlight + Artisan Hien L Mid Wine Red
- Logitech G915 TKL (red)
- Audio-Technica ATH-G1WL

Návrat na "Programovanie"