I have one variable and two functions . The variable is used by both. and the first function is changing the variable value (globally) each time it's used by it . This is what I want but it is not working with me .
x = 1;
function f1()
{
x = x + 1;
// use x
}
function f2()
{
// use x
}
I've read other threads but x is always 1 which is very frustrating :|
added: actual code
<script type="text/javascript">
function S4() {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
}
function guid() {
return (S4() + S4() + ";" + S4() + ";" + S4() + ";" + S4() + ";" + S4() + S4() + S4());
}
P = '';
function Save() {
P = guid();
$('#btnBrowse').uploadifyUpload();
}
$(document).ready(function () {
$('#txtText').elastic();
$('#btnBrowse').uploadify({
'uploader': '../uploadify.swf',
'script': '../uploadify.ashx',
'cancelImg': '/uploadify/cancel.png',
'folder': '../images/Albums/',
'multi': true,
'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)',
'fileExt': '*.jpg;*.gif;*.png',
'scriptData': { 'Album_ID': P },
'buttonText': 'Upload Images'
});
});
</script>
so the variable is P . and it is used by jquery function (uploadify) . each time I excute
Save function I expect I get a new value for variable P . But is always the same ??
The problem is the time when you execute the code. The uplodify options are set on page load (which includes that P is passed on page load) and as P is a string, changing P later (through save()) will not change the value you passed.
You can solve this by passing a reference to the object as option, instead of the string Edit: Didn't work.
The plugin provides a uploadifySettings [docs] method to change the settings of an uploadify instance. Use it to update the scriptData settings:
function Save() {
$('#btnBrowse').uploadifySettings('scriptData', {'Album_ID' : guid()}, true);
$('#btnBrowse').uploadifyUpload();
}
Maybe this fiddle can help you understand global scope a little better: http://jsfiddle.net/XFx27/1/
var x = 0;
function add1()
{
x = x + 1;
}
function show()
{
alert(x);
}
add1();
show(); //alerts 1
add1();
show(); //alerts 2
Your missing parens () after your functions function funcName()
x = 1;
function f1()
{
x = x + 1;
// use x
}
function f2()
{
// use x
}
// x is 1
f1();
// x is 2
f2();
firstly, the f1 function should be:
function f1(){
x = x + 1;
// use x
}
var x;
function f1(){
x = x + 1;
console.log(x);
}
function f2(){
console.log(x);
}
f1(); // 2
f2(); // 2
I tried the code in chrome console and I think it really works.
Related
I'm having trouble stoping the interval with clearInterval when the value reaches 100. It reaches a 100 and then keeps on executing the setInterval. Can anybody tell me what i'm doing wrong? Appreciate for your help.
i've provided a link to jsfiddle. Open console.log to see the incrementation. https://jsfiddle.net/netzsqx4/
let values = [[]]
let Circle_1 = {
procent:values[0][0],
startFrom:0,
incrementBy:0,
start: null,
intervalIdAtStart: function(){this.start= setInterval(function(){drawCircle.call(Circle_1)},500)},
clear: function() {
clearInterval(this.start);
}
}
function drawCircle(inputValues){
if(this.startFrom<this.procent){
console.log('draw <', this.procent + " " + this.startFrom)
this.startFrom++
}
else if(this.startFrom>this.procent){
console.log('draw >', this.procent + " " + this.startFrom)
this.startFrom--
}
else{
console.log('else', this.procent + " " + this.startFrom)
this.clear;
}
};
function Http(){
let output = 100
loadoutput(output)
function loadoutput(input){
console.log(input)
values = [
[input],
]
Circle_1.procent=values[0][0]
Circle_1.intervalIdAtStart()
}
}
function getValues(){
Http();
}
setTimeout(getValues,1000);
It was this.clear but it should be this.clear(). This resolved my problem.
I am new to Js and trying to develop program which can move object in zig zag format across canvas, i wrote this function but it not getting called when i run program. If anyone can check out my code it would be really helpful, thanks also like to mention that all previous functions in code are working fine but this specific function is not getting called program run until If condition but skip the function part. Also i am not looking to work with Jquery or CSS right now
if (rightPos) {
function myInterval3() {
console.log('hello');
var eLeftPos1 = e.offsetLeft;
//console.log(e.offsetLeft);
e.style.left = (eLeftPos1 + s) + 'px';
//console.log(e.style.left);
}
}
var e = document.getElementById("aDiv");
var s = 1;
function myInterval() {
var eLeftPos = e.offsetLeft;
//console.log(e.offsetLeft);
e.style.left = (eLeftPos + s) + 'px';
//console.log(e.style.left);
leftPos = (eLeftPos + s) >= 300
if (leftPos) {
function myInterval1() {
console.log(leftPos)
var eTopPos = e.offsetTop;
//console.log(e.offsetLeft);
e.style.top = (eTopPos + s) + 'px';
//console.log(e.style.top);
topPos = (eTopPos + s) >= 100
if (topPos) {
clearInterval(internal1)
}
if (topPos) {
function myInterval2() {
var eRightPos = e.offsetLeft;
//console.log(eRightPos)
e.style.left = (eRightPos - 9) + 'px'
/*console.log(e.style.left)*/
rightPos = (eRightPos - 9) <= 20
if (rightPos) {
clearInterval(interal2)
}
}
var interal2 = setInterval(myInterval2, 10)
}
}
var internal1 = setInterval(myInterval1, 100);
if (rightPos) {
function myInterval3() {
console.log('hello');
var eLeftPos1 = e.offsetLeft;
//console.log(e.offsetLeft);
e.style.left = (eLeftPos1 + s) + 'px';
//console.log(e.style.left);
}
}
}
if ((eLeftPos + s) >= 300) {
clearInterval(internal)
}
}
var internal = setInterval(myInterval, 100);
You've defined a function named myInterval3, but you're not calling it. When you write
function myInterval3() { ... }
That defines a function named myInterval3, but that's all that it does. To actually have the code inside the function run, you need to call it.
myInterval3()
To have the function called on a repeating interval, use setInterval (like you have for your other functions:
setInterval(myInterval3, 100)
I have something like the following:
function somefunc() {
function anotherfunc() {
...
if ( m > ...
...
}
$(window).on("scroll", anotherfunc);
}
somefunc();
I want to be able to change m value in execution of somefunc("value") (last step in above code snippet - somefunc();), so it would transfer the m value to the anotherfunc - but I don't know if I can(able) do so and would like to ask some for your help.
function somefunc(m) {
function anotherfunc() {
console.log(m)
}
$(window).on("scroll", function(){
anotherfunc(m);
});
}
somefunc(1);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Like commented, declare m outside the functions:
var m = 1;
console.log('Outside functions: ' + m);
function someFunc() {
m += 1;
console.log('someFunc: ' + m);
function otherFunc() {
m += 1;
console.log('otherFunc: ' + m);
}
otherFunc();
}
someFunc();
I am attempting to write a small library for scrolling events in JavaScript, but I must be missing something easy, because it seems that my vars are getting reset at some point inside of this method.
Here is the code:
var scrollEvents = {
change: window.onscroll = function (selector, property, initialValue, changedValue) {
// grab the selectors and convert them into an array so we can use forEach()
var items = document.getElementsByClassName(selector);
var itemArray = [].slice.call(items);
// window.pageYOffset has better compatibility than document.body.scrollTop
var scrollPos = window.pageYOffset;
var breakPoint = 10;
if (scrollPos > breakPoint) {
console.log('if');
console.log(items);
console.log(itemArray);
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + changedValue + ";");
console.log("style", property + ": " + changedValue + ";")
});
} else {
console.log('else');
console.log(itemArray);
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + initialValue + ";");
});
}
}
};
And I would like to call it like so:
scrollEvents.change("foo", "height", "400px", "800px");
I have quite a few extra console.log() calls inside there because I have been trying to diagnose the issue, but I have rewritten the code several times and seem to have hit a dead end.
The behavior I would like is that I can call scrollEvents.change() passing those parameters to change style attributes at certain scroll points.
Here is the code without all the extra console.log()'s:
var scrollEvents = {
change: window.onscroll = function (selector, property, initialValue, changedValue) {
// grab the selectors and convert them into an array so we can use forEach()
var items = document.getElementsByClassName(selector);
var itemArray = [].slice.call(items);
// window.pageYOffset has better compatibility than document.body.scrollTop
var scrollPos = window.pageYOffset;
var breakPoint = 10;
if (scrollPos > breakPoint) {
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + changedValue + ";");
});
} else {
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + initialValue + ";");
});
}
}
};
UPDATE:
Thanks to #pointy this library now works: https://github.com/ryanpcmcquen/scrollEvents
You've set up an object with a property called "change", and you've assigned a function to that property. The assignment also assigned the function to the "onscroll" property of the window object.
When the browser detects a user scroll operation, it will invoke that function, and regardless of your formal parameter list in the declaration it'll pass either nothing (Internet Explorer) or an event object.
Making a call to scrollEvents.change will invoke the event handler function, but that will have no effect on how the browser invokes the event handler when the user messes with the scrollbar or mouse wheel (or whatever).
I'm not sure exactly how you intend for this API to work, so it's hard to say how to fix it. If you want to attach just one event handler at a time, then the simplest thing to do would be to wrap your current code in another function:
var scrollEvents = {
change: function (selector, property, initialValue, changedValue) {
window.onscroll = function(event) {
// grab the selectors and convert them into an array so we can use forEach()
var items = document.getElementsByClassName(selector);
var itemArray = [].slice.call(items);
// window.pageYOffset has better compatibility than document.body.scrollTop
var scrollPos = window.pageYOffset;
var breakPoint = 10;
if (scrollPos > breakPoint) {
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + changedValue + ";");
});
} else {
itemArray.forEach(function (i) {
i.setAttribute("style", property + ": " + initialValue + ";");
});
}
};
}
};
Now when you call
scrollEvents.change("foo", "height", "400px", "800px");
then that function call will establish the event handler.
What I want to do is to execute a function automatically every time BEFORE ANY function is executed in JS, regardless if it's a custom or native function if possible.
ie.
whatIWant(functionName){
return console.log('called before '+functionName);
}
function blah(){
return console.log('called blah');
}
function meh(){
return console.log('called meh');
}
alert('woot');
blah();
//will output :
//called before blah
//called blah
meh();
//will output :
//called before meh
//called meh
alert();
//will output :
//called before alert
//will pop up dialog: woot
I do not want to do the following:
Function.prototype.onBefore = function(){};
blah.onBefore();
is it even possible to do what I am asking for? any suggestions, read, or w/e?
Thanks in advance.
What about just providing your function as a callback to whatIWant like this:
function whatIWant(fn) {
var fnName = fn.toString();
fnName = fnName.substr('function '.length);
fnName = fnName.substr(0, fnName.indexOf('('));
console.log('called before ' + fnName);
fn();
}
function meh() {
console.log('called meh');
}
function blah() {
console.log('called blah');
}
whatIWant(meh);
whatIWant(blah);
whatIWant(alert)
what do you guys think about this solution? :)
function bleh(){
console.log('exe a');
}
function limitFn(fn,n) {
var limit = n ;
var counter = 1 ;
var fnName = fn.toString();
fnName = fnName.substr('function '.length);
fnName = fnName.substr(0, fnName.indexOf('('));
return function(){
if(counter <= limit) {
console.log(counter + ' call before ' + fnName + ' limit ' + limit);
counter++;
fn();
} else {
console.log('limit of ' + limit + ' exes reached') ;
}
};
}
limited = limitFn(bleh,2);
limited();
limited();
limited();
limited();