Develop Reference

onclick return two functions (Tracking)

I'm trying to trigger two functions on the onclick event. They are used for tracking link from website. One is for GoogletagManager, the other one is for AdForm tracking.
I get error that the function is not defined. Any solutions to make this work?
Link
<script type="text/javascript">
function myFunction(){
secondone();
firstone();
}
function firstone() {
return console.log('first');
return gtag_report_conversion1('http://www.example.com');
}
function secondone() {
return console.log('second');
return window.adf&&adf.ClickTrack ( this,{123456},'Page Name',{});
}
</script>
<script>
function gtag_report_conversion1(url) {
var callback = function () {
if (typeof(url) != 'undefined') {
window.location = url;
}
};
gtag('event', 'conversion', {
'send_to': 'AW-465465465465465',
'event_callback': callback
});
return false;
}
</script>
<script type="text/javascript">
window._adftrack = Array.isArray(window._adftrack) ? window._adftrack : (window._adftrack ? [window._adftrack] : []);
window._adftrack.push({
pm: 123456,
divider: encodeURIComponent('|'),
pagename: encodeURIComponent('Page Name')
});
(function () { var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'https://track.adform.net/serving/scripts/trackpoint/async/'; var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x); })();
</script>

After reading your edit - try moving all of the functions to the same <script></script> tag :)

jQuery tabs working on some but not all websites

I am attempting to create a tabbed form that will work across several websites. I have found that the code snippet works on some pages, and the tabs exist and function properly, but on one particular website the tabs do not display and I get the following console error: Uncaught TypeError: $(...).tabs is not a function. I have not had any luck debugging this myself or searching for answers online. Any help would be appreciated :)
Website I have issues with: http://www.jetstar.com/sg/en/home
Website it appears to work fine on: https://tigerair.com.au/
Note that the code snippet below assumes jQuery does exist on the website already. I have tried loading the latest version of jQuery first also with no luck.
if (typeof($) == 'undefined') {
var $ = jQuery;
}
function createInvisibleDiv() {
var invisiblePageSizedDiv = document.createElement("div");
invisiblePageSizedDiv.setAttribute("id", "pageDiv");
invisiblePageSizedDiv.setAttribute("class", "overlay");
document.body.appendChild(invisiblePageSizedDiv);
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.overlay{bottom:0; right:0; left: 0; top:0; overflow:hidden;background-color:rgba(88,88,90,0.8); z-index: 100; position:absolute;}';
document.body.appendChild(style);
document.body.style.position = "relative";
}
//this function creates the two tabs
function createUnorderedList(){
var $unorderedList = $("<ul></ul>");
$unorderedList.attr("id", "unorderedList");
$unorderedList.attr("class", "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all")
for (var i=1; i<3; ++i) {
var $linkItem = $("<li></li>");
$linkItem.append(createLink(i));
$linkItem.attr("class", "ui-state-default ui-corner-top")
$unorderedList.append($linkItem);
}
return $unorderedList;
}
function createLink(i){
var $link = $("<a></a>");
if (i==1) {
$link.attr({"href":'#foo', "title":"Foo"});
$link.text("Foo");
} else {
$link.attr({"href":'#bar', "title":"Bar"});
$link.text("Bar");
}
return $link;
}
function createFooForm() {
var $ele = $("<div></div>");
$ele.attr("id", "foo");
$ele.text("Thanks for looking at my code");
return $ele;
}
function createBarForm() {
var $ele = $("<div></div>");
$ele.attr("id", "bar");
$ele.text("I super appreciate it!");
return $ele;
}
function loadScript(url, callback)
{
// Adding the script tag to the head
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
// Then bind the event to the callback function.
script.onreadystatechange = callback;
script.onload = callback;
// Fire the loading
head.appendChild(script);
}
var generateTabsFunction = function() {
createInvisibleDiv();
var $invisibleDiv = $('#pageDiv');
var $containerDiv = $("<div></div>");
$containerDiv.attr("id", "containerDiv");
$containerDiv.append(createUnorderedList());
$containerDiv.append(createFooForm());
$containerDiv.append(createBarForm());
$invisibleDiv.append($containerDiv);
$('body').append($containerDiv);
$( "#containerDiv" ).tabs();
}
$("<link/>", {
rel: "stylesheet",
type: "text/css",
href: "https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css"
}).appendTo("head");
loadScript("https://code.jquery.com/ui/1.12.1/jquery-ui.js", generateTabsFunction);

Sounds like you have included JQuery, but forgot to include JQueryUI

how to remove previous js file from DOM

(function() {
setTimeout(function(){
$('#core-notify').remove();
$('#yourDynamicGeneratedScript').remove();
$('#yourDynamicGeneratedScriptHtml').remove();
context = $("#context").val();
lid = $("#userid").val();
tid = $("#tenentId").val();
dp_url = $("#dpUrl").val();
var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute('id', 'yourDynamicGeneratedScript');
script_tag.setAttribute("src",
"https://sa.nlpbots.com/lightbot/js/light_bot.js");
(document.getElementsByTagName("head")[0]).appendChild(script_tag);
console.log((document.getElementsByTagName("head")[0]));
},1000);
})();
This code removes a script by tag id but it only removes it from the head tag, not from the DOM file.

Every function in seperated js files but included only if used

Hey all im trying something (because im boring) every function as js files can be used but if only needed file will bi apended. so i have write something like this. some parts from this site.
library.js:
var jsfiles = new Array(
"jsLibrary/try.js",
"jsLibrary/try2.js"
);
var loadedJsFiles = [];
function loadFile(filepath,callback){
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = filepath;
script.onreadystatechange = callback;
script.onload = callback;
head.appendChild(script);
}
function loadalljs(callback,jsnum){
if(!jsnum){jsnum = 0;}
if(jsnum<jsfiles.length){
if(!isArrayNode(jsfiles[jsnum],loadedJsFiles)){
loadedJsFiles.push(jsfiles[jsnum]);
loadFile(jsfiles[jsnum],function(){
loadalljs(callback,jsnum+1);
});
}else{
loadalljs(callback,jsnum+1);
}
}else if(jsnum==jsfiles.length){
callback();
}
}
function isArrayNode(str, arr) {
for (var i = 0; i < arr.length; i++) {
if (str == arr[i]) {
return true;
}
}
return false;
}
function lb(){
this.scripts = function(callback,includePageJs){
loadalljs(function(){
if(includePageJs){
loadFile(includePageJs,function(){
callback();
})
}else{
callback();
}
});
};
this.a = 5;
}
var library = new lb;
try.js:
function tryfunction(){
alert("try");
}
try2.js:
function try2(){
alert("try2");
}
mypage.js:
function mypagefunction(){
alert("mypagejs");
}
and im using it like this:
<script type="text/javascript" src="jsLibrary/library.js"></script>
<script>
library.scripts(function(){
tryfunction();
try2();
mypagefunction();
},"jsLibrary/mypagejs.js");
library.scripts(function(){
alert(library.a)
});
</script>
is there any way to do this with easy way? thanks for any idea or help. (Not in jquery please)

Use Requirejs
<script>
requirejs.config({
paths: {
'try1': '../path_to_your_try.js',
'try2': '../path_to_your_try2.js',
'mypage': '../path_to_your_mypage.js',
}
});
require([
'try1', 'try2', 'mypage'
], function(Try1, Try2, MyPage){
// Try1 refer to try1 file
// Try2 refer to try2 file
// MyPage refer to mypage file
});
</script>

How can I call a .js file in onclick event

I did like:
onclick="document.write('document.write(-------)');"

function importJavascript(src) {
var tag = document.createElement('SCRIPT');
tag.src = src;
document.getElementsByTagName('HEAD')[0].appendChild(tag);
}
Hope it helps

Click Here

<script>function getJs(src, callback) {
if (src && typeof src === "string") {
var el = document.createElement("script");
el.type = "text/javascript";
el.src = src;
document.head.appendChild(el);
el.onload = function(e) {
(callback && callback instanceof Function) ? callback(e) : void(0);
}
}
}
<script>
<div onclick='getJs("location_to_the_js_file.js")'></div>

what about using jQuery.getScript(), if you are using jQuery in your application already