/ / um clique href não aciona em jquery - javascript, jquery

um clique href não disparando em jquery - javascript, jquery

        $(function() {

$.getJSON("companies.json", function(response) {

var html = "<table id="tbl">";
response.businesses.forEach(function(row) {
html += "<tr><td><a href="#" class="move" idname="" + row.id + "">" + row.id + "</a></td><td>" + row.name;
});
html += "</table>";

$("#tabledata").html(html);
});


$(".move").click(function() {

var $id = $(this).attr("idname");

$.getJSON("companies.json", function(response) {


$.map(response.businesses, function(obj) {
if (obj.id == $id)
console.log(obj);
return obj; // or return obj.name, whatever.
});
});
});
});

HTML:

    <div id="tabledata" class="left"></div>
<div class="right"></div>

Por favor ajude?

Respostas:

2 para resposta № 1

Como seu .move elemento é adicionado à sua página dinamicamente, você deve fazer uso de jQuery "s on() método para delegar o evento para um ancestral do .move elemento que existe quando seu JavaScript é carregado pela primeira vez.

$(document).on("click", ".move", function() { ... });

A delegação de eventos nos permite anexar um únicoevent listener, para um elemento pai, que será acionado para todos os descendentes que correspondem a um seletor, independentemente de esses descendentes existirem agora ou serem adicionados no futuro.

Você pode ler mais sobre a delegação de eventos do jQuery Aqui.


2 para resposta № 2

Se você usar a delegação de eventos, seu problema desaparece (e seu aplicativo se torna mais eficiente e menos sujeito a vazamentos de memória).

// Only do this once, when your page loads...
$(document.body).on("click", ".move", function (ev) {
// This is the link that was clicked.
var $targ = $(ev.target);
});

0 para resposta № 3

Tente isto

$("#tabledata").on("click", ".move", function(e) { ... });

0 para a resposta № 4

A razão pela qual o evento não está sendo disparado é porque o evento só é adicionado aos elementos que existem na página quando você chama .click() método.

Em vez disso, você pode usar a delegação de eventos:

$(document.body).on("click", ".move", function (ev) {
var $targ = $(ev.target);
});

que realmente diz: chame a função quando qualquer elemento que corresponda .move que está dentro document.body é clicado.

Eu sei que outros já disseram isso, mas eu queria deixar a delegação de eventos mais clara.