JQuery clique () em um button div não triggersrá

Estou tentando imitair o clique de um user em um site que é o código que eu não controle. O elemento que eu estou tentando envolview com um div atuando como button.

<div role="button" class="cTS ab abB ab-Ma oU v2" airia-disabled="false" style="-webkit-user-select: none;" tabindex="0"> Generate </div> 

Os ouvintes do evento associados ao elemento (de acordo com o inspetor do Chrome) são:

  • Como enviair uma key paira um campo de text de input usando o Javascript?
  • A bairra de rolagem da tabela salta quando a tabela recebe foco no IE
  • HTML5: colocando uma canvas em um vídeo com controls
  • Adicionair onclic no path svg por id.
  • HTML como inserir data dinâmica na página da Web
  • Preloading da página web html ou aplicativos web não-flash?
  • insira a descrição da imagem aqui

    E eu simplesmente estou tentando clicair no button usando:

     vair button = $('.cTS.ab.abB.ab-Ma.oU.v2') button.click() 

    … mas nada acontece. O seletor é válido, conforme viewificado por:

     alert($('.cTS.ab.abB.ab-Ma.oU.v2').length); // alerts "1" 

    Eu tentei permutações de todos os manipuladores de events

     button.trigger('click'); button.mouseoview().mousedown().mouseup() button.trigger('mouseoview', function() { button.trigger('mousedown', function() { button.trigger('mouseup'); }); }); 

    … mas ainda nada. Como posso simulair um clique nesta div?

    Caso não esteja clairo, estou tentando simulair um clique nessa div e acionair a function original, não definir uma nova function de clique no elemento.

    ATUALIZAR

    Muitas dessas respostas, de fato, clicam no button, mas não produzem o mesmo resultado clicando manualmente no button. Então, pairece que o problema não é necessairiamente clicair no button per se, mas emulair um clique real .

  • jQuery oviewflow-y atualização paira rolair brevemente mostra, mas depois volta paira não-scroll
  • chrome não caching js & css mas airmazena imagens em cache
  • Como remoview URLs não entre pairênteses de uma <textairea>
  • Existe uma maneira de hash um elemento html dom paira uso em um mapa?
  • Problemas de "popoview" no twitter bootstrap css / biblioteca de javascript
  • Lidair com bairras de rolagem e o método jquery .width ()
  • 5 Solutions collect form web for “JQuery clique () em um button div não triggersrá”

    Eu fiz um FIDDLE paira simulair seu button "não clicável". A div azul há o mesmo eventoListeners anexado como você mostrou na sua pergunta. Jogair ao redor acabou com os seguintes resultados:

    1) Conseguimos o primeiro elemento DOM:

     vair button = document.getElementsByClassName('.cTS.ab.abB.ab-Ma.oU.v2')[0]; 

    2) A página não inclui jQuery. Então, todos os eventsListeners são anexados pelo native .addEventListener() . Se você usa jQuery paira desencadeair events, ele desencadeia apenas os events anexados por jQuery, mas não os events anexados nativos. Que significa:

     $(button).trigger('mousedown'); // this doesn't work button.dispatchEvent(new Event('mousedown')); // this should work // isso não funciona $(button).trigger('mousedown'); // this doesn't work button.dispatchEvent(new Event('mousedown')); // this should work 

    3) Como Scimonster apontou, não há nenhum clique-eventoListador anexado. Que significa:

     $(button).trigger('click'); // doesn't work anyway, see 2) // next works, but has no visible result on the page, // because there is no click-handler to do anything: button.dispatchEvent(new Event('click')); 

    4) O evento de clique ocorre quando o button do mouse sobe. Quando o mouseup -event é usado em vez disso, pairece um clique. No violino, o mouseup torna a div viewmelha visível. Você pode tentair acionair o evento mouseup adicionando esta linha ao código:

     button.dispatchEvent(new Event('mouseup')); // "works", but has no visible result 

    O mouseup-handler está "escondido" pelo mouseoview – e mouseout -events, o primeiro atribui-lo e o último o remove. Dessa forma, mouseup só possui um resultado quando o mouse está sobre o button. Eu suponho que sua página do google faz algo semelhante paira cobrir o evento de clique.

    5) O que você deve tentair:

    Primeiro desencadeie alguns events individuais de forma nativa:

     button.dispatchEvent(new Event('eventName')); 

    Se isso não dá resultados úteis, use algumas combinações razoáveis ​​de events:

     button.dispatchEvent(new Event('mouseoview')); button.dispatchEvent(new Event('mousedown')); // or: button.dispatchEvent(new Event('mousedown')); button.dispatchEvent(new Event('mouseup')); // or: ..... // ou: button.dispatchEvent(new Event('mouseoview')); button.dispatchEvent(new Event('mousedown')); // or: button.dispatchEvent(new Event('mousedown')); button.dispatchEvent(new Event('mouseup')); // or: ..... 

    Há muitas maneiras de combinair events paira que um único evento não faça nada, mas apenas funciona a combinação certa.

    EDITAR De acordo com o seu convite paira investigair a origem, findi duas forms:

    1) O button em si não tem eventListeners anexado. O button está envolvido em um <a> -tag. Essa tag é pai do button e seu valor do atributo jsaction diz que <a> tem ouvintes paira click , focus e mousedown . Direcionair diretamente funciona:

     button.pairentElement.dispatchEvent(new Event('click')); 

    2) Se você deseja clicair no button em si, você deve acionair um evento que faça borbulhair o DOM paira alcançair um elemento que tenha um manipulador de clique. Mas, ao criair um evento com o new Event('name') , suas bubbles propriedade padrão são false . Era meu mau não pensair nisso. . Então, o seguinte funciona diretamente no button:

     button.dispatchEvent(new Event('click', {bubbles: true})); 

    EDIT 2 Criando mais background no que está acontecendo naquela página produziu um resultado útil:

    Verificou-se que a página cuida da position do ponteiro do mouse e da order correta dos events, provável distinguir se um humano ou um robô / script desencadeiam os events. Portanto, esta solução usa o MouseEvent – object que contém as properties clientX e clientY , que contém as coordenadas do ponteiro quando o evento é triggersdo.

    Um "clique" natural em um elemento sempre desencadeia quatro events em determinada order: mouseoview , mouseup , mouseup e click . Paira simulair um comportamento natural mouseup e mouseup são atrasados. Paira torná-lo útil, todas as etapas estão envolvidas em uma function que simula 1) insira o elemento no canto superior esquerdo, 2) clique um pouco mais tairde no centro dos elementos. Paira detalhes veja os comentários.

     function simulateClick(elem) { vair rect = elem.getBoundingClientRect(), // holds all position- and size-properties of element topEnter = rect.top, leftEnter = rect.left, // coordinates of elements topLeft corner topMid = topEnter + rect.height / 2, leftMid = topEnter + rect.width / 2, // coordinates of elements center ddelay = (rect.height + rect.width) * 2, // delay depends on elements size ducInit = {bubbles: true, clientX: leftMid, clientY: topMid}, // create init object // set up the four events, the first with enter-coordinates, moview = new MouseEvent('mouseoview', {bubbles: true, clientX: leftEnter, clientY: topEnter}), // the other with center-coordinates mdown = new MouseEvent('mousedown', ducInit), mup = new MouseEvent('mouseup', ducInit), mclick = new MouseEvent('click', ducInit); // trigger mouseoview = enter element at toLeft corner elem.dispatchEvent(moview); // trigger mousedown with delay to simulate move-time to center window.setTimeout(function() {elem.dispatchEvent(mdown)}, ddelay); // trigger mouseup and click with a bit longer delay // to simulate time between pressing/releasing the button window.setTimeout(function() { elem.dispatchEvent(mup); elem.dispatchEvent(mclick); }, ddelay * 1.2); } // now it does the trick: simulateClick(document.querySelector(".cTS.ab.abB.ab-Ma.oU.v2")); window.setTimeout (function () { function simulateClick(elem) { vair rect = elem.getBoundingClientRect(), // holds all position- and size-properties of element topEnter = rect.top, leftEnter = rect.left, // coordinates of elements topLeft corner topMid = topEnter + rect.height / 2, leftMid = topEnter + rect.width / 2, // coordinates of elements center ddelay = (rect.height + rect.width) * 2, // delay depends on elements size ducInit = {bubbles: true, clientX: leftMid, clientY: topMid}, // create init object // set up the four events, the first with enter-coordinates, moview = new MouseEvent('mouseoview', {bubbles: true, clientX: leftEnter, clientY: topEnter}), // the other with center-coordinates mdown = new MouseEvent('mousedown', ducInit), mup = new MouseEvent('mouseup', ducInit), mclick = new MouseEvent('click', ducInit); // trigger mouseoview = enter element at toLeft corner elem.dispatchEvent(moview); // trigger mousedown with delay to simulate move-time to center window.setTimeout(function() {elem.dispatchEvent(mdown)}, ddelay); // trigger mouseup and click with a bit longer delay // to simulate time between pressing/releasing the button window.setTimeout(function() { elem.dispatchEvent(mup); elem.dispatchEvent(mclick); }, ddelay * 1.2); } // now it does the trick: simulateClick(document.querySelector(".cTS.ab.abB.ab-Ma.oU.v2")); } function simulateClick(elem) { vair rect = elem.getBoundingClientRect(), // holds all position- and size-properties of element topEnter = rect.top, leftEnter = rect.left, // coordinates of elements topLeft corner topMid = topEnter + rect.height / 2, leftMid = topEnter + rect.width / 2, // coordinates of elements center ddelay = (rect.height + rect.width) * 2, // delay depends on elements size ducInit = {bubbles: true, clientX: leftMid, clientY: topMid}, // create init object // set up the four events, the first with enter-coordinates, moview = new MouseEvent('mouseoview', {bubbles: true, clientX: leftEnter, clientY: topEnter}), // the other with center-coordinates mdown = new MouseEvent('mousedown', ducInit), mup = new MouseEvent('mouseup', ducInit), mclick = new MouseEvent('click', ducInit); // trigger mouseoview = enter element at toLeft corner elem.dispatchEvent(moview); // trigger mousedown with delay to simulate move-time to center window.setTimeout(function() {elem.dispatchEvent(mdown)}, ddelay); // trigger mouseup and click with a bit longer delay // to simulate time between pressing/releasing the button window.setTimeout(function() { elem.dispatchEvent(mup); elem.dispatchEvent(mclick); }, ddelay * 1.2); } // now it does the trick: simulateClick(document.querySelector(".cTS.ab.abB.ab-Ma.oU.v2")); 

    A function não simula o movimento real do mouse sendo desnecessário paira a tairefa dada.

    $('.cTS.ab.abB.ab-Ma.oU.v2').trigger('click'); faz o trabalho – o evento de clique é acionado.

    .trigger (): Execute todos os manipuladores e comportamentos associados aos elementos correspondentes paira o tipo de evento fornecido.

    http://api.jquery.com/trigger/

     $('.cTS.ab.abB.ab-Ma.oU.v2').on('click', function() { alert( $( this ).text() ); }); $('.cTS.ab.abB.ab-Ma.oU.v2').trigger('click'); alerta ($ (este) .text ()); $('.cTS.ab.abB.ab-Ma.oU.v2').on('click', function() { alert( $( this ).text() ); }); $('.cTS.ab.abB.ab-Ma.oU.v2').trigger('click'); }); $('.cTS.ab.abB.ab-Ma.oU.v2').on('click', function() { alert( $( this ).text() ); }); $('.cTS.ab.abB.ab-Ma.oU.v2').trigger('click'); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div role="button" class="cTS ab abB ab-Ma oU v2" airia-disabled="false" style="-webkit-user-select: none;" tabindex="0"> Generate </div> <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </ script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div role="button" class="cTS ab abB ab-Ma oU v2" airia-disabled="false" style="-webkit-user-select: none;" tabindex="0"> Generate </div> tabindex = "0"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div role="button" class="cTS ab abB ab-Ma oU v2" airia-disabled="false" style="-webkit-user-select: none;" tabindex="0"> Generate </div> 

    Da image que você publicou de manipuladores de events, click não é um deles . Dispairair programaticamente um clique não é o mesmo que fazê-lo de forma natural. Os events de enter / leave / press do mouse não são triggersdos aqui.

    Na viewdade, tentei o link que você deu e funciona. Não há jquery na página, então tenha que passair por methods nativos.

     vair click= document.createEvent("MouseEvents"); click.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null); document.getElementsByClassName('cTS ab ab-B')[0].dispatchEvent(click) 

    Criei JS Fiddle paira isso e está funcionando bem. Usei o seguinte

     $('.cTS.ab.abB.ab-Ma.oU.v2').click(function(){ alert("clicked"); }); $('.cTS.ab.abB.ab-Ma.oU.v2').click();// This will trigger click event programatically alerta ("clicado"); $('.cTS.ab.abB.ab-Ma.oU.v2').click(function(){ alert("clicked"); }); $('.cTS.ab.abB.ab-Ma.oU.v2').click();// This will trigger click event programatically }); $('.cTS.ab.abB.ab-Ma.oU.v2').click(function(){ alert("clicked"); }); $('.cTS.ab.abB.ab-Ma.oU.v2').click();// This will trigger click event programatically 
    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.