|
JavaScript - An If Statement With Check Target Properties
Not sure if I even ask correctly. Excuse the poor PHP man for not knowing javascript. I need to add a check to this code.
It picks up an image when you click on it, then puts it down when you click again. What it needs is another check WHERE (on what) have you clicked to put it down. If it's a particular DIV then OK. If not (if elsewhere) don't put it down and don't change the click counter. Code: <html>
<head>
<style type="text/css">
.drag
{
position: relative;
height:56px;
width:56px;
background-color:#FF0000;
color:White;
}
</style>
<script type="text/javascript">
var _startX = 0; // mouse starting positions
var _startY = 0;
var _offsetX = 0; // current element offset
var _offsetY = 0;
var _dragElement;
var _oldZIndex = 0; // we temporarily increase the z-index during drag
var _debug;
var _countClick = 0;
InitDragDrop();
function InitDragDrop() {
document.onclick = OnMouseClick;
document.onMouseClick = OnMouseClick;
}
function OnMouseClick(e) {
debugger;
_debug = $('debug');
// if first click this is zero
if (_countClick == 0) {
// IE
if (e == null)
e = window.event;
// IE uses srcElement, others use target
var target = e.target != null ? e.target : e.srcElement;
_debug.innerHTML = target.className == 'drag'
? 'draggable element clicked'
: 'NON-draggable element clicked';
// for IE, left click == 1
// for Firefox, left click == 0
if ((e.button == 1 && window.event != null || e.button == 0) && target.className == 'drag') {
// grab the mouse position
_startX = e.clientX;
_startY = e.clientY;
// grab the clicked element's position
_offsetX = ExtractNumber(target.style.left);
_offsetY = ExtractNumber(target.style.top);
// bring the clicked element to the front while it is being dragged
_oldZIndex = target.style.zIndex;
target.style.zIndex = 10000;
// set _dragElement for next click
_dragElement = target;
// tell our code to start moving the element with the mouse
document.onmousemove = OnMouseMove;
// cancel out any text selections
document.body.focus();
// prevent text selection in IE
document.onselectstart = function() { return false; };
// prevent IE from trying to drag an image
target.ondragstart = function() { return false; };
//set click count to 1 so we know next click is to release
_countClick = 1;
// prevent text selection (except IE)
return false;
}
}
if (_countClick == 1) {
if (_dragElement != null) {
_dragElement.style.zIndex = _oldZIndex;
// we're done with these events until the next OnMouseDown
document.onmousemove = null;
document.onselectstart = null;
_dragElement.ondragstart = null;
// this is how we know we're not dragging
_dragElement = null;
_debug.innerHTML = 'mouse up';
}
//set click count back to 0 so next we know it's first click again
_countClick = 0;
}
}
function OnMouseMove(e) {
if (e == null)
var e = window.event;
// this is the actual "drag code"
_dragElement.style.left = (_offsetX + e.clientX - _startX) + 'px';
_dragElement.style.top = (_offsetY + e.clientY - _startY) + 'px';
_debug.innerHTML = '(' + _dragElement.style.left + ', ' +
_dragElement.style.top + ')';
}
function ExtractNumber(value) {
var n = parseInt(value);
return n == null || isNaN(n) ? 0 : n;
}
// this is simply a shortcut for the eyes and fingers
function $(id) {
return document.getElementById(id);
}
function OnMouseUp(e) {
}
</script>
</head>
<body>
<div id="thediv" class="drag" style='background: url(shield.gif) no-repeat center top;'></div>
<pre id="debug"> </pre>
<div id="slot1" class="dropon" style='position: absolute; height:28px; width:28px; top: 200px; left: 200px; background-color:#FF0000; color:White;'></div>
<div id="slot2" class="dropon" style='position: absolute; height:28px; width:28px; top: 200px; left: 230px; background-color:#FF0000; color:White;'></div>
</body>
</html>
Similar TutorialsHey everyone, I'm a newbie writing a tic tac toe program using OOP. It was simple setting it up so that a player could click on a box to put an X or an O there, but I've run into serious issues when trying to make it so a player couldn't overwrite the AI's choice and the AI couldn't overwrite the player's. An example of this would be if I made the top right box an X and the AI then made the center box an O, and then I accidentally clicked the center box and made it into an X. I want to prevent that. Every box on the grid is an object with the property of "taken" that helps the program know if a box is empty or not, so as to avert any overwriting in the first place. If the box is empty, this.taken = 0. If the box is filled by a player, taken = 1. If filled by AI, taken = 2. I made it matter whether it was AI or human so later i can check if one of them got tic tac toe. Anyway, by default the constructor class sets this.taken = 0. But the method for checking availability and writing the X or O uses a switch which checks if taken = 0. If it is, it sets taken to either 1 or 2 and writes the necessary symbol. If taken = 1 or 2, it just alerts the player that the spot is taken. But for some reason the switch statement can't tell when taken = anything other than 0. It always executes the code for 0 even though the code for 0 inherently makes it so that taken never equals 0 again, which means case 0 cannot happen anymore. Below is the code with notes. Code: function main(input){//start of main function//
function Click(who, where, what){ //this is the method for checking if it's taken or not and writing the X or O if it isn't//
/*the argument who represents a number. 0 is no one, 1 is human, 2 is AI; where is a string literal
representing the spot on the grid*/
switch(this.taken){
case 0:
this.taken = who;
document.getElementById(where).innerHTML = what;
break;
case 1:
alert("this spot is taken");
break;
case 2:
alert("this spot is taken");
}//end switch
}//end Click
function Box(inputhere){//start of class//
this.taken = 0;
this.pick = Click;
}
//end of Box class//
//object declarations (I cut out most of them and left only the relevant ones//
var topleft = new Box();
var topmid = new Box();
var topright = new Box();
var centerright = new Box();
//end of object declarations//
switch (input){
/*in each .pick(), the first arg is whether or not a player chose it (1 = player did, 2 = comp did).
The second arg is which box and the third is whether to put an X or O. The input variable in the switch statement is an argument passed through main() when the
player clicks on a box. Topleft passes 1.1, topmid passes 1.2 and so on.*/
case 1.1:{
//The first instance of .pick() in each case is what the player did. The second is what the AI will do in repsonse.//
topleft.pick(1, "topleft", "X");
topmid.pick(2, "topmid", "<span>O</span>");
break;
}//end of case 1.1
case 1.3:{
topright.pick(1, "topright", "X");
centerright.pick(2, "centerright", "<span>O</span>");
break;
}//end of case 1.3
}//end of switch
}//end of main//
Is there anyone who has any idea why on earth this is happening? I've been at it for an embarrassing amount of hours. Also, thanks to anyone who even considers helping : ) (feel free to flame me if my code sucks or my post is too long or anything). Hi Experts here, Pls help. I have written the html code like this: <a href="http://mypage.com/docfiles" target="_blank"> Click </a> But the problem is when ever the user click the click option complete url is displaying in two ways 1)on the buttom of the status bar 2)Right click on the option open the properties than also we are getting the complete url. But we don't want to see the complete url,How to hide the Url. Please give me solution I am struggling alot. Thanks and Regards, Srinivas yadav. I HAVE BEEN TRYING TO FIGURE OUT THE PARAMETERS IN THE FUNCTIONS, INCLUDING THE ARRAYS [i], [p], ["get_" + i], ["set_" + i] AND HOW THE METHODS ARE BEING CALLED IN RELATION TO i, p and val, so that I can make sense of this code. If possible can you explain the code also What I will like to know are the properties and methods of the objects generated in the following code? Also I want to know how I can use those methods to show and change the name and age for the emp2 object. this is the code: function Employee(properties) { for (var i in properties) { if (properties.hasOwnProperty(i) && typeof properties[i] != 'function') { this["get_"+i] = (function(p) { return function() { return properties[p]; }; })(i); this["set_"+i] = (function(p) { return function(val) { properties[p] = val; }; })(i); } } } var emp1 = new Employee({ name: "Bob", age: 35, foo: function() {} }); var emp2 = new Employee({ name: "Gary", age: 54 }); Hey all, I have a simple example below showing how when I pass in the value of the value attribute of option node, and then use if operator to check whether parameter is a string or not, even though it's a string, it converts it to false boolean and triggers the else statement rather than calling a function: Code: <body> <select> <option value="createMsg">Add Message</option> <option value="removeMsg">Remove Message</option> </select> </body> Code: var menu = {
handleMenu : function(callback){
if(callback === "string"){
menu[callback]();
}
else {
console.log("Issue occurred")
}
},
createMsg : function(){
var content = document.createTextNode("Please give additional information."),
heading = document.createElement("h1");
heading.appendChild(content);
document.body.appendChild(heading);
},
removeMsg : function(){
}
}
document.getElementsByTagName('select')[0].onchange = function(){ menu.handleMenu(this.value)};
callback should be a string so why is it saying otherwise? Thanks for response Hi, I've done control in asp.net/javascript and it works on some pages of mine and as it often happens doesn't work on customer's pages . All pages are run in IE 6.0. After I run debugger I've found out that on my page offsetLeft/Top clientHeight properties have some non-zero values. I have <span id="listCLient" style="width:200px;">..</span> and on my test page elListClient.clientHeight = 200, but on customer's app's page it is 0x0 ? Same with other offsetXXX properties etc. But elListClient.style.height bears correct value. I use those properties everywhere. I think it is some settings somewhere ? or CSS styles ? Can anyone help ? Thanks a lot Vladislav On this webpage http://www.corkdiscos.com/testimonials.html i have a like button. when a user clicks like a comment box appears. when i unlike the button the comment box disappears this is ok but when a user has already liked the facebook page and comes to my webpage the comment box does not show. so im looking for a piece of javascript to check if a user has like the button on my page and if so to show the comment box. please check my source code of the website http://www.corkdiscos.com/testimonials.html to see what i have so far. any help would be greatly appreciated Hi, I want to a javascript function like showModalDialog(<page_name>,'','<options>') here in the option I need to have overlay property where I can set opacity values. Is there any solution? Please letme know I'm not sure I phrased the question properly and it's probably easiest to show what I'm trying to get. Basically, I want to find all the properties(?) available for a single track object in iTunes. For example, this is how I access what's stored as the Album and Artist for a track: Code: var myTracks = myPlaylists(1).Tracks; alert(myTracks(1).Album); alert(myTracks(1).Artist); There are a ton of properties (like Album and Artist), but I don't know what they all are, so I was trying to list them like this, but it doesn't work: Code: for(var key in myTracks(1)) alert(key); It's probably obvious why this doesn't work, but does anyone know how to get this list? Thanks for any help! I have developped a script in order to resize the height of a div on a web page in order to display it at least up to the size of the window. Here is the code: function resize(){ var frame = document.getElementById("content"); var padding_top = parseInt(window.getComputedStyle(frame,null).getPropertyValue("padding-top")); var padding_bottom = parseInt(window.getComputedStyle(frame,null).getPropertyValue("padding-bottom")); var padding = padding_top + padding_bottom; var bodyheight = document.body.scrollHeight; var windowheight = window.innerHeight; if (bodyheight < windowheight){ frame.style.height = windowheight - padding + "px"; } } It works well, but I was wondering why I am not able to get the padding-top and -bottom using these two instructions: var padding_top = frame.style.paddingTop; var padding_bottom = frame.style.paddingBottom; The script runs but Firebug shows empty strings for both values. How come? Is there a bug in Firefox? Thanks inadvance for your time and help. Is there a way to circle trough the native properties (constructor, prototype, length) of an Array object? Obviously, a simple for(a in array) won't do the trick.
Hello. I'm Ansem717 and I've been honestly coding Javascript since August; however, I have learned and coded a few things a couple years ago. I'm not a master at Javascript, but I can follow along what most people say or code. I decided to test my skill in coding, by making a text-based RPG game via Javascript. Now that I've introduced my background information about JS coding, I'd like some of you to help me out with the following code: (It's fairly big, but skip it to see the actual content.) PHP Code: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Text Based</title> <link rel="stylesheet" href="ssgame.css" media="screen" /> <script type="text/javascript"> // JavaScript Document var d=document; //Easy shorthand var inventoryWeight=500; //Inventory cannot be heavier than 500 'units' var inventoryMaximum=30; //Inventory cannot have more than 30 items var n='\n'; //Line break for Game screen var nts=n+" "; //Line break for game screen plus three spaces for formating. I'm lazy like that XD var presentRoom=0; var player=null; var objectsInRoom=null; var allOptions="SELF INFO__LOOK AROUND__WALK NORTH__WALK SOUTH__WALK WEST__WALK EAST__ATTACK__TALK__PICKUP__DROP__INVENTORY"; function get(id) { return d.getElementById(id); } function gameSCRN(msg,overwrite,linebreak) { if (linebreak==1) var val = d.tb.gamescreen.value+n; if (linebreak==2) var val = d.tb.gamescreen.value+n+n; else var val = d.tb.gamescreen.value; d.tb.gamescreen.value = (overwrite!=1) ? val+msg : msg; d.tb.mymove.value=""; d.tb.myname.value=""; } //////////////////////////////// //SET ITEMS, NCPS, AND PLAYERS// //////////////////////////////// function Obj(name, health, strength, defense, speed, weight){ this.name = name; this.hp = health; this.str = strength; this.def = defense; this.spd = speed; this.wgh = weight; } var items=new Array(); items[0]=new Array();//ENEMY items[0][0]=new Obj('Kid Goblin', 5, 3, 2, 1) items[0][1]=new Obj('Adult Goblin', 15, 6, 4, 3) items[1]=new Array();//WEAPON items[1][0]=new Obj('Dagger', 0, 2, 0, -1, 5) items[1][1]=new Obj('Ax', 0, 7, 0, -2, 9) items[2]=new Array();//ARMOR items[2][0]=new Obj('Cloth Shirt', 0, 0, 3, 3, 1) items[2][1]=new Obj('Chainmail', 0, 0, 8, -1, 15) ///////////// //SET ROOMS// ///////////// function room(name,actions,objectsInRoom,defaultTxT) { this.name = name this.text = defaultTxT; this.actions = (actions&&actions!=0) ? actions.split("__") : "There are no actions present in this room"; this.objects = (objectsInRoom&&objectsInRoom!=0) ? objectsInRoom.split("__") : "There are no objects present in this room"; } var rooms=new Array(); rooms[0]=new room("clearing","SELF INFO__LOOK AROUND__WALK NORTH__WALK WEST__WALK EAST__WALK SOUTH__DROP",0,player.name+" is stranded in a clearing.") rooms[1]=new room("goblin hideout","SELF INFO__LOOK AROUND__WALK SOUTH__ATTACK__TALK__DROP",items[0][0]+"__"+items[0][1],player.name+" has approched a goblin hideout!") rooms[2]=new room("weaponry","SELF INFO__LOOK AROUND__WALK WEST__PICKUP__DROP",items[1][0]+"__"+items[1][1],player.name+" is inside a weaponry! Weapons increase "+player.name+"\'s strength, but may decrease his speed. Another thing to account for is "+player.name+"\'s inventory and weight. It's not like "+player.name+"\'s inventory has no end.") rooms[3]=new room("armory","SELF INFO__LOOK AROUND__WALK NORTH__PICKUP__DROP",items[2][0]+"__"+items[2][1],player.name+" is in an armory! Armor increases "+player.name+"\'s defence, but may decrease, or even increase, his speed. Another thing to account for is "+player.name+"\'s inventory and weight as well as the Armor's weight. It's not like "+player.name+"\'s inventory has no end.") rooms[4]=new room("empty room","SELF INFO__LOOK AROUND__WALK EAST__DROP",0,player.name+" has noticed a sign that says, \"No one may enter.\" Behind the sign, there is a large barbed fence that "+player.name+" cannot penetrate.") //////Actual Content function gameStart() { d.tb.gamescreen.value=" "; gameSCRN('First thing is first. Name yourself! At the bottom, there should be a small box you can type into. Type your name into that box.',1,1); } function nameSelf() { var name=d.tb.myname.value; player=new Obj(name, 100, 0, 0, 5); gameSCRN(n+"Hello there "+player.name+"!"+n+n+"In a couple of seconds, the game will begin."); get("name").style.display="none"; get("act").style.display="block"; setTimeout(function(){ActualGameStart();},5000) } function ActualGameStart() { presentRoom=0 visualizeRoom(); } function visualizeRoom() { gameSCRN(rooms[presentRoom].text,1,0); if (rooms[presentRoom].actions!="There are no actions present in this room") { for (i=0; i<rooms[presentRoom].actions.length; i++) { gameSCRN(rooms[presentRoom].actions[i],1,0); } } else { gameSCRN(rooms[presentRoom].actions,1,0); } } //The below functions have been commented out because I had an idea. I didn't want these to collide, and since that idea is almost complete, I'm keeping these incase I need to take some of the below and scatter them up top. /*function PreformAction() { var dsmv=d.tb.mymove.value.toUpperCase(); var cnotdsmv="You cannot "+dsmv+" at this moment."; if (dsmv==diffOptions[0]) { if (room==1) {gameSCRN(player.name+" "+dsmv+" but doesn't seem to find anything",0,2);} //Center room if (room==2) {gameSCRN("room==2",0,2);} //Northern Room if (room==3) {gameSCRN("room==3",0,2);} //Eastern if (room==4) {gameSCRN("room==4",0,2);} //Southern if (room==5) {gameSCRN("room==5",0,2);} //Western } else if (dsmv==diffOptions[1]) { if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 2. Add extra functions and karp here.",0,2);} if (room==2) {gameSCRN(cnotdsmv,0,2);} if (room==3) {gameSCRN(cnotdsmv,0,2);} if (room==4) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);} if (room==5) {gameSCRN(cnotdsmv,0,2);} } else if (dsmv==diffOptions[2]) { if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 4. Add extra functions and karp here.",0,2);} if (room==2) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);} if (room==3) {gameSCRN(cnotdsmv,0,2);} if (room==4) {gameSCRN(cnotdsmv,0,2);} if (room==5) {gameSCRN(cnotdsmv,0,2);} } else if (dsmv==diffOptions[3]) { if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 5. Add extra functions and karp here.",0,2);} if (room==2) {gameSCRN(cnotdsmv,0,2);} if (room==3) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);} if (room==4) {gameSCRN(cnotdsmv,0,2);} if (room==5) {gameSCRN(cnotdsmv,0,2);} } else if (dsmv==diffOptions[4]) { if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 3. Add extra functions and karp here.",0,2);} if (room==2) {gameSCRN(cnotdsmv,0,2);} if (room==3) {gameSCRN(cnotdsmv,0,2);} if (room==4) {gameSCRN(cnotdsmv,0,2);} if (room==5) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);} } }*/ /*function displayOptions(objects) { if (objects=="none") { gameSCRN(n+n+"OPTIONS:",0,1) gameSCRN(nts+diffOptions[0],0,0) gameSCRN(nts+diffOptions[1],0,0) gameSCRN(nts+diffOptions[2],0,0) gameSCRN(nts+diffOptions[3],0,0) gameSCRN(nts+diffOptions[4],0,0) } }*/ </script> </head> <body> <center> <h1>Text-Based Game Name Coming Soon</h1> <form name="tb" id="tb"> <textarea id="gamescreen" name="gamescreen" cols="67" rows="20" onfocus="blur()"></textarea><br /><br /> <div id="act"> What do you do?<br /> <input type="text" id="mymove" name="mymove" /><br /> <input type="button" id="wdyd" name="wdyd" value="Preform action!" onclick="PreformAction()" /> </div> <div id="name"> What do you do?<br /> <input type="text" id="myname" name="myname" /><br /> <input type="button" id="namebtn" name="namebtn" value="Preform action!" onclick="nameSelf()" /> </div> </form> </center> </body> <script type="text/javascript"> //Initiate functions gameStart(); </script> </html> Sorry It's so large. I'm have a major bug and it's getting in my way. It has to do with the rooms objects. As you can see I set a new array to have the ability to create rooms on the spot and each of the rooms contacted the function of creating an object. PHP Code: function room(name,actions,objectsInRoom,defaultTxT) { this.name = name this.text = defaultTxT; this.actions = (actions&&actions!=0) ? actions.split("__") : "There are no actions present in this room"; this.objects = (objectsInRoom&&objectsInRoom!=0) ? objectsInRoom.split("__") : "There are no objects present in this room"; } var rooms=new Array(); rooms[0]=new room("clearing","SELF INFO__LOOK AROUND__WALK NORTH__WALK WEST__WALK EAST__WALK SOUTH__DROP",0,player.name+" is stranded in a clearing.") rooms[1]=new room("goblin hideout","SELF INFO__LOOK AROUND__WALK SOUTH__ATTACK__TALK__DROP",items[0][0]+"__"+items[0][1],player.name+" has approched a goblin hideout!") rooms[2]=new room("weaponry","SELF INFO__LOOK AROUND__WALK WEST__PICKUP__DROP",items[1][0]+"__"+items[1][1],player.name+" is inside a weaponry! Weapons increase "+player.name+"\'s strength, but may decrease his speed. Another thing to account for is "+player.name+"\'s inventory and weight. It's not like "+player.name+"\'s inventory has no end.") rooms[3]=new room("armory","SELF INFO__LOOK AROUND__WALK NORTH__PICKUP__DROP",items[2][0]+"__"+items[2][1],player.name+" is in an armory! Armor increases "+player.name+"\'s defence, but may decrease, or even increase, his speed. Another thing to account for is "+player.name+"\'s inventory and weight as well as the Armor's weight. It's not like "+player.name+"\'s inventory has no end.") rooms[4]=new room("empty room","SELF INFO__LOOK AROUND__WALK EAST__DROP",0,player.name+" has noticed a sign that says, \"No one may enter.\" Behind the sign, there is a large barbed fence that "+player.name+" cannot penetrate.") In the above code, I'm creating various objects following under the variables rooms[0] to rooms[4], yea?. At the very beggining of the whole RPG game, it brings up some text saying name yourself in the input box below. After you do that, it adds more text to a textarea 'reminding' you of what your name was. The game then is supposed to start right after that, but thats when we run into these functions, on which counteract with the variabled rooms above: PHP Code: function gameStart() { d.tb.gamescreen.value=" "; gameSCRN('First thing is first. Name yourself! At the bottom, there should be a small box you can type into. Type your name into that box.',1,1); } function nameSelf() { var name=d.tb.myname.value; player=new Obj(name, 100, 0, 0, 5); gameSCRN(n+"Hello there "+player.name+"!"+n+n+"In a couple of seconds, the game will begin."); get("name").style.display="none"; get("act").style.display="block"; setTimeout(function(){ActualGameStart();},5000) } function ActualGameStart() { presentRoom=0 visualizeRoom(); } function visualizeRoom() { gameSCRN(rooms[presentRoom].text,1,0); if (rooms[presentRoom].actions!="There are no actions present in this room") { for (i=0; i<rooms[presentRoom].actions.length; i++) { gameSCRN(rooms[presentRoom].actions[i],1,0); } } else { gameSCRN(rooms[presentRoom].actions,1,0); } } As you can see, we have the starting function which is initiated after all of the HTML elements load, then we have the "nameSelf()" function which creates the player as well as sets the timeout for the actual game. The main error code is right he gameSCRN(rooms[presentRoom].text,1,0); and in both IE and Firefox, the script doesn't continue. It doesn't preform the "gameSCRN()" function. In IE, I'm able to click on something that shows me errors within the browser. The Error IE presented: 'rooms[...].text' is null or not an object. What does this mean? I remember setting 'rooms[0].text' to have a string value, and I did do some debugging, 'rooms[0].text' does return with the apropreate value, as well as, 'rooms[presentRoom].text' does too. They just won't work in the above function? I have searched your forums, very good codes out there, but I have not found something concrete that can fix this bug. I'd be really grateful for your help as well as some hints and tips on Javascript coding, since I would also like some help on cleaning up my javascript. And no, I am not taking any programming courses, however much I wish I am. Thanks in advanced! --Regards, --Ansem717 Hey guys, I'm trying to obtain the object of the element on the page that is clicked, but my code is unable to set the target. Here's what I have. The JavaScript Code: function show_info(e){
//get the targeted element.
var targ;
if (!e) var e = window.event;
if (e.target) targ = e.target;
else if (e.srcElement) targ = e.srcElement;
if (targ.nodeType == 3) targ = targ.parentNode;
alert (targ); //FAIL!
}
The Form Code: <form action="#" method="post"> <input type="hidden" name\"id" value="" /> <input type="submit" name="submit" value="Info" onclick="show_info()"/> </form> What I want to do is get the target element(the submit button) so that I can get its sibling(it contains a unique ID). But it's not working. Do many programmers remember most of the object properties and methods or do they use IDE or references to find those specific objects. I'm starting to learn Javascript and seeing all the different type of objects available can be depressing. > 1. The fifth cell contains a drop-down selection list for the quantity of items ordered as the first child node of the table cell. > Store the reference to this selection list in the variable > `qtySelect`. > 2. Store the value of the selected option in the `qtySelect` object in the `newItem`'s `qty` property. > 3. Associate each selection list with a particular store item (you must do this because the table contains 13 different selection lists; > one for each store item) by adding a custom property to `qtySelect` > named `currentItem`, and set it equal to the `newItem` variable. > 4. Add an `onchange` event handler to `qtySelect` that sets the `qty` property value of the `currentItem` property to the value of the > selected option in the `qtySelect` selection list. ---------- I need help setting up the currentItem property so that newItem.qty updates properly when a different selection is made. function storeItem() { this.pid; this.descr; this.price; this.qty = 1; } function startShopping() { var tbody = document.getElementById("saltItems").tBodies[0]; var rows = tbody.rows; for (var i = 0; i < rows.length; i++) { var newItem = new storeItem(); var cells = rows[i].cells; newItem.pid = cells[0].innerHTML; newItem.prod = cells[1].innerHTML; newItem.desc = cells[2].innerHTML; newItem.price = cells[3].innerHTML; var selID = newItem.pid+"Qty"; var qtySelect = document.getElementById(selID); var index = qtySelect.selectedIndex; newItem.qty = qtySelect.options[index].value; } } example of one of the table rows: <tr> <td>FSSPJ11</td> <td>Fine Sea Salt</td> <td>Plastic Shaker Jar (11 oz.)</td> <td class="price">$4.15</td> <td><select id="FSSPJ11Qty"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </td> <td class="cartAdd"><input type="checkbox" id="FSSPJ11" /></td> </tr> Hi all! I'm pretty new to JavaScript and completely new to this forum. I'm James. Well uh, I'm not sure how to... I wanted to make something like this using javascript... Code: myObject.someMethod('something').anotherProperty
much like the Code: document.getElementById('someId').style.morestuff
But the thing is, I've been around every DOM whatnot I can find, I just can't seem to make it work. I kinda need it to make my own DOM for some API i'm writing. So I can write like... Code: function someGreatAPI(){
this.property1='';
this.property2='';
//...
this.method1 = function(var1){ //this should make my firstMethod
this.nestedProperty = 0;
this.nestedMethod = someFunction; //firstMethods nested method
}
}
//so I can use it like...
var obj = new someGreatAPI();
obj.method1(10).nestedMethod();
It has to be possible, it's possible with document.getelementbyid, right? it has to be. Thanks in advance. I have something like this var oneTest = new CustomObj({ prop1 : 'value1', prop2 : 'value2', prop3 : 'value3' }) var twoText = Object.clone(oneTest) twoText.prop2 = "newvalue2" And when I console log twoText I see something like +Data prop2 Inside Data is a prop2 that has the value of "value2". THAT is the one I want to change/override... yet the console shows me that the prop2 is outside of the data structure so when I am acting on the cloned obj I am not getting the results i need. I tried obj.extend etc.... and that didn't work, perhaps my syntax was wrong. Any advice? I'm still learning js core using Flanagan's 5th ed. so please bear with me; is the if ("ignore" in arguments.callee) return; below valid or a typeo? Thanks J. Code: function inspect(inspector, title) {
var expression, result;
// You can use a breakpoint to turn off subsequent breakpoints by
// creating a property named "ignore" on this function.
if ("ignore" in arguments.callee) return;
.......
I have a few banners and forms that I wish to open in a new tab not the same window or a new window. I have tried the deprecated Code: target="_blank" but even that opens a new window. I have done some research on google and came up with CSS code: Code: form[target] {
target-name: new;
target-new: tab;
}
a[target] {
target-name: new;
target-new: tab;
}
This however does not work and opens in the same window. When using the CSS I remove the inline target. Any Ideas on how to fix this? |
|||||||