Is it possible passing a function with a custom data attribute?
This does not work:
<div data-myattr="hello();">
</div>
function hello(){
console.log('hello');
}
When I get the attribute it's a string with the value "hello();" instead of the function. How to solve this?
You could do it as follows:
<div data-myattr="hello"></div>
function hello(){
console.log('hello');
}
function executeFunctionFromData(){
var d = 'hello' // Save `data-myattr` to d; (Obviously, this is just a hardcoded value as an example)
window[d](); // Execute the function.
}
This works because the function hello is defined in the global scope, and as such, is a property of the window object.
<div id='some' data-my-function="function(x){console.log(x);}"></div>
js:
var myfunction = $('#some').data('my-function');
if(myfunction != undefined){
eval("myfunction = "+myfunction, myfunction);
}
if(typeof myfunction ==="function") {
myfunction('Cristo Rabani!');
}
Using Webpack.
<div data-func="funcName"></div>
window.funcName = function() {};
Use eval:
eval("alert('hello');");
Will show hello;
