PDA

View Full Version : Accessing dynamic div based off array.



lmbarns
01-21-2012, 08:56 PM
edit again: Tried adding onclick to the div when it's created, but have been having trouble getting it working right. Currently:


pack.innerHTML += '<div id="'+i+'" class="clickable" onclick="rangerItem('+ i +'); Fn('+ i + ":" + playerRanger[i]+'); ">'+ i +" <br />"+playerRanger[i]+'</div>';

var drophere;
function rangerItem(i){
console.log('rangerFired:'+i);
drophere=document.getElementById('drop1');
drophere.innerHTML= i ;
console.log(playerRanger[i]);
console.log(i);
}

function Fn(i){
console.log('Fn: '+i);
}


This gives an error when I click the different divs
missing ) after argument list
[Break On This Error] rangerItem(ranger_boots); Fn(ranger_boots:1);

The error has the right properties as parameters, I clicked ranger_boots div, and the 1 is how many I had when I clicked the icon.

Anyone have any ideas?????


Here's the context of it, I deleted it when I edited, but maybe it makes more sense seeing the entire function:


for (var i in playerRanger){ //for each object in array
if(playerRanger[i] > 0){ //if the number of objects in array is 1 or more (if player has one)

if(document.getElementById("pack")!= null){

pack.innerHTML += '<div id="'+i+'" class="clickable" onclick="rangerItem('+ i +'); Fn('+ i + ":" + playerRanger[i]+'); ">'+ i +" <br />"+playerRanger[i]+'</div>';

$(function() {
$( ".clickable" ).draggable(); });
}
}

}

vwphillips
01-22-2012, 04:34 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
.clickable{
width:100px;height:100px;background-Color:red;
}

/*]]>*/
</style></head>

<body>
<div id="tst" ></div>

<script type="text/javascript">
/*<![CDATA[*/
playerRanger=[];
playerRanger[0]='tom';
playerRanger[1]='joe';

for (var i=0;i<playerRanger.length;i++){
document.getElementById('tst').innerHTML += '<div id="'+i+'" class="clickable" onclick="rangerItem('+ i +');Fn('+i+',\''+playerRanger[i]+'\');" >'+i+'<br>'+playerRanger[i]+'</div>';
}

var drophere;
function rangerItem(i){
alert(i);
}

function Fn(i,r){
alert('Fn: '+i+':'+r);
}

/*]]>*/
</script>
</body>

</html>