Intermittent problem with Uncaught Typeerror: Cannot read Property 'locac' of Undefined

Question

I’m having this problem

Uncaught Typeerror: Cannot read Property 'locac' of Undefined

With the code:

function fnc(){    
    var evt = (window.event ? window.event : event);
    var elemento = evt.target;
    var params = $(elemento).data('params');
    alert(params.locac);
}

$('body').on('click','button.inst',fnc);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" data-params='{"locac":"reg","titulo":"Inserir Registro"}' class="btn btn-success inst">Inserir</button>

Example link: example

But not always the error occurs, there are times I click on the button several times and does not give this error, more times I click once and already gives error.

Sometimes there’s a mistake and there’s no mistake.

The only mistake I see in real world

Answer 1

There are no apparent errors in your code, but I believe the solution is to place your script inside the ready jQuery. Read here.

Do so:

$(function () {
    function fnc(){    
        var evt = (window.event ? window.event : event);
        var elemento = evt.target;
        var params = $(elemento).data('params');
        alert(params.locac);
    }

    $('body').on('click','button.inst',fnc);
});

It’s good practice to always use this pattern when you need to manipulate the DOM.