I'm working with nested functions and trying to pass a 'this' value to an anonymous being used in an assignment for an event listener.So, this should plop a button inside our DIV and when clicked I'd like it to run the alert-ding; unfortunately it seems to want to run the function as defined under the buttons object which doesn't work out too well.
View 3 RepliesI need to pass the 'id' variable from the event listener to the callback function, 'moveObject'. The moveObject function needs to know the id of which element it should act upon. How can I pass this variable?
View 3 Replies View RelatedThe html part:
Code HTML4Strict:
<div id='data'></div>
<form action="">
<input id="nomeInput" type="text" name="nomeInput" value="" autocomplete="false"/>
[Code].....
This is the entry point for doing an autocomplete, but for know, I would just like to ask:
What should we do so that, the text that is typed, appears on that alert box?
I did search the forums but couldn't seem to find anything on this specifically. I basically need to pass a key event and a 'name' to nameCheck() after 3 seconds. This works fine in Firefox but Internet Explorer gives the error: Member not found. I'm more of a PHP guy than a JS one
<input type="text" onkeyup="nameCheckTimer(this.value, event)" value="" />
function nameCheckTimer(name, evt) {
setTimeout(function(){return nameCheck(name,evt)}, 3000);
}
function nameCheck(name, evt) {
//need name and the key event to be available here. I have code to handle the key codes which works fine
}
I am trying to create an anonymous function for onchange event of file field, so that when a file is selected, the covering text field gets that value. I know how to accomplish this by adding onchange="", but I'd prefer not do that. The code that I have almost works, except that the function in the for loop can't call on the "i" variable that the loop uses.
for( i = 0; i < source.length; i++) {
source[i].onchange = function() {
name[i].value = this.value;
}
}
Event Listener. From what I understand it will check all events until a defined event happens, such as rollover of a certain image, and then it activates a function? What I want to do is use this so that when I rollover a element such as below:
<img src="img url" alt="this is a tooltip" tooltip="true" />
I want it to pass the obj to a function which then runs, and then once the mouse of not over that element it will activate another function passing the previous object to this function.
Although an element such as the example below would not activate these functions:
<img src="img url" alt="this is a tooltip"/>
As the tooltip tag does not exist or has the value of false. Also, wouldn't this use a lot of resources as it checks every event which the mouse passes over?
in the below code I am trying to dynamically add a button and an event listener to it.
Code:
<html>
<head>
[code]....
I have an iframe that includes a button:
<input type="button" value="close this window" onclick="window.close();" >
I would like to detect the iframe close event from the parent window, I
was using this code but I did something wrong because the temp function
is fired every time the parent page loads:
function temp(){
alert('the iframe was closed');
}
function setup(){
var myIFrame = document.getElementById("iframe1");
if (myIFrame.addEventListener) {
myIFrame.addEventListener('onclose', temp(), false);
}else if (myIFrame.attachEvent) {
myIFrame.attachEvent ('onclose',temp);
}else{
myIFrame.onclose=temp();
}
}
window.onload=setup;
I've got a really simple function I want to create, a confirm delete function that is applied to all links with a class of delete. A confirm message appears when the link is clicked, returning false if cancel is clicked.
This is my code and for whatever reason that I just don't get (coz I'm a bit confused by all this stuff), clicking cancel when the confirm message appears seems to return true regardless. Code:
How do I add an event listener to a few text boxes that prevents the user from typing anything but digits. I use the numbers entered in the text boxes in calculations afterwards so I don't want the user to enter "one" instead of "1" etc... Also, the range of possible numbers is too big for a drop down menu.
View 6 Replies View RelatedI'm writing a custom script to collect attributes from links and concatenate them to pass as a string to another function. I'm using a readily-available 'addListener' function so the click event doesn't overwrite others on the page. All this seems to be working in all browsers except IE6, and I suspect it may have something to do with event bubbling. Can anyone see my errors and any other ways I could improve the script? Code:
View 4 Replies View RelatedI'm trying to use the addEventListener function to set an event listener but I don't understand why it won't work. Before i was using another method to handle events, but I needed more control over which event handlers get run and when.
Code:
<html>
<head>
<script type="text/javascript">
function runMe(){
[Code]....
I'm using Google Chrome, but it won't work in Firefox either. Obviously it won't work in IE, since IE doesn't support that method. The script gives no errors at all. The runMe() function does get executed, I tested this with alerts.
Am I able to pass a function literal (at least I think that's what it's called) to a jquery event handler, and retrieved the event details in the function?
[Code]...
I'm having issues while passing the triggered event with .on.
obj.on('click', feedmania.handler.itemFeedmania.toggleFormComment);
I've tried:
obj.on('click', feedmania.handler.itemFeedmania.toggleFormComment(e));
obj.on('click', function(e){feedmania.handler.itemFeedmania.toggleFormComment(e)});
[Code]...
Do I have a simple syntax problem or something more serious.... I get the errror "foo is not defined" when the image is clicked in the following:
[Code]...
I want each instance of an object to be able to listen for input events.
When the event occurs, a method of the object should be called, such
that "this" is in scope and refers to the object instance.
Is this possible? Example:
function MyConstructor(element)
{
//element is some HTML element
this.addListeners(element);
this.foo = "Bar";
return this;
}
MyConstructor.prototype.addListeners = function(element)
{
element.addEventListener("keypress", this.doSomething, true);
}
MyConstructor.prototype.doSomething = function(e)
{
alert(this.foo.length); //Error: this.foo has no properties
alert(this);
//shows the HTML element that triggered the event
}
Is there any way to get "this" to refer to the object in the event listener?
Inline scripting makes this easy but I'm getting Typeof MissMatch error when I use Unobtrusive script and I think it's because of the diffrence between DOM and DHTML.
INLINE:
HTML Code:
Unobtrusive attach event listner/external js.
Code:
This writen in the js of the index.html containing the IFRAME 'display' runs once imediatley on load then imediatley after throws 'typeof mismatch' error.
I have a form with many, many, many 'input type="text"' elements in it. I'd like to be able to dynamically add an 'onKeyDown' event listener. Here's what I've got, so far (I know it's wrong.)
Code:
function addEventToElement(formName,tagName,typeName,eventName,eventAction) {
thisForm = (typeof formName == 'string') ? document.getElementById(formName) : '' ;
thisTag = (typeof tagName == 'string') ? tagName : '' ;
thisType = (typeof typeName == 'string') ? typeName : '' ;
thisEvent = (typeof eventName == 'string') ? eventName : '' ;
thisAction = (typeof eventAction == 'string') ? eventAction : '' ;
if(thisForm != "") { // If elements are in a form, make sure ONLY those elements are affected
elem = new Array(); elem = thisForm.getElementsByTagName(thisTag); // array of all items of [tag]
alert(elem.length);
if(thisType != "") {
for(j=0;j<elem.length;j++) {
if(elem[j].type != thisType) { elem.splice(j,1); } // If a type is specified, remove tags that do not have a type attribute
}
}
}
else { // Otherwise, any/all elements in a document/body will be affected
elem = new Array(); elem = document.getElementsByTagName(thisTag); // array of all items of [tag]
if(thisType != "") {
for(j=0;j<elem.length;j++) {
if(elem[j].type != thisType) { elem.splice(j,1); } // If a type is specified, remove tags that do not have a type attribute
}
}
}
if((thisEvent != "") && (thisAction != "")) {
for(i=0;i<elem.length;i++) { // All elements are picked - let's apply some attributes
document.getElementById(elem[i].id).addEventListener(thisEvent,thisAction,false)
}
}
}
HTML Code:
addEventToElement('form_name','input','text','keydown','return numbersOnly(event,this);');
HTML CODE BELOW (JAVASCRIPT CODE FOLLOWS);
[Code]...
This program below switches what is entered into the text filed to caps when hitting the enter button or the tab button.
[Code]...
I tried to append a table row to a table by clicking on a button. And inside the table, I put a link so i can click that and remove the row. I was using jquery.flydom plugin, by the way. [code]...
View 1 Replies View RelatedI am trying to add a window event listener on some links in a loop instead of doing them one by one. I've tried
function setListeners (){
for (var i = 0; i < document.links.length; i++) {
src=document.links[i].href;
document.links[i].onmousemove=changeIframeSrc(src, 'solid',1, event);
document.links[i].onmouseout=changeIframeSrc(null,'none',0,event);
[Code]...
I am testing some code that finds and element and attempts to add an event handler attribute to it as 'onclick' (test case in Firefox 3.5.9)
/*
The actual code is:
window.onload = function()
{
//<irrelevant code>
var test = document.getElementById('tstEl');
[Code]...
I am trying to do this because Element.addEventListener or Element.attachEvent won't allow for arguments to be passed to the event handler code/function. What is going on here? The only line referenced, line35, in the document text containing javascript code is irrelevant to the problem.
I'm not new to JS, or the web and it's various other technologies, but I ran into a problem. I'm trying to add an event handler for a click on all HTML span tags. Trouble is, getElementByTags() doesn't work and neither does getElementByTagNames(). Strangely, adding an id to the span tags and getting their id's do trigger the handler.
Code:
document.getElementsByTagName('span').addEventListener('click',doSomething,false);
function doSomething() {
alert(this);
How would i add an avent listener to change the source of an image? I have added the image to a canvas element through javascript using the code below.
var start = new Image();
start.src = "start.jpg";
ctx.drawImage(start, 50, 50);
What I need is simple. Here I created 3 links and after that I want to add dinamically an onclick event to alert the number of the link. The problem is I can't find the way to pass the variable.Obviouslly this is not the actual function, but I need to solve this problem to apply the solution into a more complex script.
View 3 Replies View RelatedI'm really just playing around, trying to be as unobtrusive as possible, meaning that I didn't want to just do the standard on mouseover/onmouseout event actions inline in my html. My attempt was relatively close, I just need a way to be able to capture the event action without passing it into a function?
Code:
<script>
var getTabs = function(){
var allTabs = document.getElementsByTagName("div");
for (var i=0;i<allTabs.length;i++){
if (allTabs[i].className == "tabs"){
if (allTabs[i].id == this.id){
if (this.onmouseover != null){
//alert("MouseOVer");
document.getElementById(this.id).style.backgroundColor = "#465D77";
} else if (this.onmouseout != null) {
//alert("MouseOOut");
document.getElementById(this.id).style.backgroundColor = "#1a3757";
}}}}}
onload = function(){
document.getElementById("tabHR").onmouseover = getTabs;
document.getElementById("tabHR").onmouseout = getTabs;
}
</script>
HTML Code:
<!-- Begin Tabs Container -->
<div id="tabsContainer">
<div id="tabGlobal" class="tabsActive">
Home
</div>
<div id="tabHR" class="tabs">
HR Edit
</div>
<div id="tabReports" class="tabs">
Reporting
</div>
<div id="tabData" class="tabs">
Data
</div>
</div>
<!-- End Tabs Container -->