Any reason why this javascript blink code won't work? - javascript

I have the below code in the second of two js files from a web-app.
It works fine, until I combine the two js files into one. Then the js breaks.
function oBlink()
{
return window.setInterval
(
function()
{
$("#sOr").css("background-color", function (){ this.switch = !this.switch; return this.switch ? "#F90" : "" });
}
, 500
);
}
I've isolated the problem to the code
this.switch = !this.switch; return this.switch ? "#F90" : ""
If I take that out, the rest of my js works fine.
I understand there are a lot of external variables that could be coming into play here, but I just wanted to check with you guys that the above function code doesn't have any errors in it.
Thanks for taking a look.

it's working fine in the browser, but failing when checking it on certain devices in the Android emulator.
That's probably because you are using switch in your code which is a reserved word in JavaScript. Only ECMAScript5-based browsers allow using reserved words as object's properties.
Instead of using a flag you can declare a CSS class and use the jQuery's toggleClass method.

Make sure you define somewhere
switch = false
Then Try
$("#sOr").css("background-color", function (){ this.switch =
!this.switch; return (this.switch ? "#F90" : "#FFF" ) });

Related

Don't understand how to call ordinary function in a *.js javascript file

I'm trying to learn basic javascript.
I've created this jsfiddle:
http://jsfiddle.net/Friar_Broccoli/b2gur/
function useless(callback) { return callback(); }
var text = 'Domo arigato!';
assert(useless(function(){ return text; }) === text,
"The useless function works! " + text);
which is straight out of page 37 of:
http://netcraft.co.il/fedia/books/SecretsoftheJavaScriptNinja.pdf
It does NOTHING, and if I add:
document.writeln(text);
it works only if I place it immediately after the "var text = .." declaration. Not the first time I've had this type of problem, although I sometimes succeed in getting javascript functions to work properly.
So
(1) Why does nothing work after the assert() call?
(2) How can I make it work?
(3) Is there somewhere I can find a for-morons explanation of how to organize code in a *.js file?
Thanks;
1) There is no assert() function, so the code fails and doesn't do the rest. If you put an output right after " var text = 'Domo arigato!'; ", it works only because it simply manages to get up to that point without an error.
2) You need to define your own assert function, something like :
function assert(condition,okMessage,failMessage){
if(condition) document.writeln(okMessage);
else document.writeln(failMessage);
}
3) There is no problem with your code organization.
Your fiddle has no defined "assert" method.
This is a good read for you :
http://www.w3schools.com/js/js_functions.asp
functions don't start themself, you need to start them with an onload / onclick / etc event.

JavaScript: Variable is false but if statement is true?

I have this JS code:
var show = elm.hasClassName('level0') ? false : true;
if(show) {
doSomething()
}
I am using FireBug to check the value of show and it clearly states false. While debugging, I noticed that the doSomething function is called anyway. What am I missing?
Using if(false) does not run the doSomething function.
Thanks!
From whatever code you have shown (!!!), I believe that your debugging is wrong. May be you are seeing the value of
elm.hasClassName('level0')
as
false
But, var show = elm.hasClassName('level0') ? false : true; means show will be set to inverse of elm.hasClassName('level0')
Just add an alert(show) above the if condition and see what is printed. See this fiddle http://jsfiddle.net/g4Zqp/1/ It works perfectly fine.
If this is not the case, you need to put your complete code
Try this
if( !elm.hasClassName('level0')) {
doSomething()
}

How to tell if tinyMCE has been initated?

I initiate the tinyMCE like this in multiple tabs of JQuery:Tab. But I find to init tinyMCE multiple times yields readonly text areas. Thus I wish to check if tinyMCE is already initated. Is there a method like isInitated() or something similarly convenient there?
tinyMCE.init({
mode : "textareas",
theme : "simple",
width : "500",
height : "300"
});
You can use tinymce.editors.length to see if there is already an editor instance initalized (tinymce.editors.length > 0).
I know this question is old, but...in case someone is still looking for the holy grail:
in tinymce 4, you can pass a callback to tinyMCE.init like so:
tinyMCE.init({
//your regular parameters here...
setup: function(editor) {
editor.on('init', function() {
//all your after init logics here.
});
}
});
You can add init_instance_callback to init() parameters. This callback will be invoked when the tinymce instance is already inited.
I am using tincyMCE 4.7.2
I tried the answer of #Thariama and it did not work for me, I guess because his answer is valid for the older versions of the tinyMCE.
here is what worked for me (again, according to the version you are working on, this could not be helpful for you)
if (tinymce.initialized === true)
To check if "tinyMCE" is set just use this:
if(typeof(tinyMCE) != "undefined") {}
Try this:
if (typeof(tinymce.activeEditor.contentDocument) !== "undefined") {
// initialized
}
I found other solution for this.
Let's say that You've got element
<textarea id="tinymce0"></textarea>
Now let's say that You initialize it:
let config = { selector : '#tinymce0'};
tinymce.init(config);
After that You can make this:
let tinmyMceInstance = tinymce.get('tinymce0');
if( tinmyMceInstance === null ){
// Your code if not initialized
}
Keep in mind:
this works only with id, seems like using classname for get() won't work
Works in:
{
releaseDate: "2019-05-09",
majorVersion: "5",
minorVersion: "0.5",
}
So it's probably: 5.5

Unable to re-define a function in my javascript object

I have an object defined using literal notation as follows (example code used). This is in an external script file.
if (RF == null) var RF = {};
RF.Example= {
onDoSomething: function () { alert('Original Definition');} ,
method1 : function(){ RF.Example.onDoSomething(); }
}
In my .aspx page I have the following ..
$(document).ready(function () {
RF.Example.onDoSomething = function(){ alert('New Definition'); };
RF.Example.method1();
});
When the page loads the document.ready is called but the alert('Original Definition'); is only ever shown. Can someone point me in the right direction. I basically want to redefine the onDoSomething function. Thanks, Ben.
Edit
Thanks for the comments, I can see that is working. Would it matter that method1 is actually calling another method that takes the onDoSomething() function as a callback parameter? e.g.
method1 : function(){
RF.Example2.callbackFunction(function() {RF.Example.onDoSomething();});
}
Your code as quoted should work (and does: http://jsbin.com/uguva4), so something other than what's in your question is causing this behavior. For instance, if you're using any kind of JavaScript compiler (like Closure) or minifier or something, the names may be being changed, which case you're adding a new onDoSomething when the old one has been renamed. Alternately, perhaps the alert is being triggered by something else, not what you think is triggering it. Or something else may have grabbed a reference to the old onDoSomething (elsewhere in the external script, perhaps) and be using it directly, like this: http://jsbin.com/uguva4/2.
Thanks for the response .. in the end the answer was unrelated to the code posted. Cheers for verifying I wasn't going bonkers.

How to return $(this)

I'm using jQuery and made a plugin for some in house work that basically builds URLs for our internal API. Anyways, I want to return $(this) and im not getting the right thing and im getting a createdocumentfragment error?
Plugin code:
$.get(base_url,{
agenda_id:defaults.id,
action:defaults.action+defaults.type,
output:defaults.output
},function(html){
defaults.callback(html);
});
That works fine, but i want to add return obj like so:
$.get(base_url,{
agenda_id:defaults.id,
action:defaults.action+defaults.type,
output:defaults.output
},function(html){
defaults.callback(html);
return obj;
});
Obj is set at the start of my plugin and obj works fine throughout the plugin. It's set as obj=$(this);
In my script, which uses the plugin, I have:
$('#agenda-live-preview').agenda({action:'get',type:'agenda',id:window.location.href.split('/').pop(),callback:function(html){
$(this).empty().append($(html).html());
}});
However, it doesn't work and returns:
Error: doc.createDocumentFragment is not a function
Source File: http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js
Line: 4373
In the console error logs. Any ideas how to return $(this) AND run the callback?
I (finally) left a comment in your other question. :o) I'm pretty sure you need to do this in your plugin:
defaults.callback.call(this,html);
instead of:
defaults.callback(html);
It sounds like you want to return the object to the original caller.
agenda = function(opts, callback) {
$.get(base_url,{
agenda_id:defaults.id,
action:defaults.action+defaults.type,
output:defaults.output
},function(html){
defaults.callback(html);
});
return obj;
}
I'm guessing the idea is to enable chaining, so that you can say something like
$('#id').agenda(opts).show();
or whatever. Of course, this will execute just after the $.get is issued and not after it is completed, but this is normal and probably what you want.

Categories