如何触发点击按钮 [英] How to trigger click on a button

问题描述

我本页面。我需要使用AngularJS触发此页面上的BUY NOW按钮。

我已经尝试了这些方法在内容脚本中点击此立即购买

  angular.element（$（'ul form form button：contains（立即购买 ） '）得到（0））triggerHandler（' 点击'）; 
 
 $（'ul form button：contains（立即购买）'）。get（0）.click（）; 
 $ b $（'ul form form button：contains（BUY NOW）'）。get（0）.dispatchEvent（new MouseEvent（'click'，{$ b $'view'：window， 
'bubbles'：true，
'cancelable'：true 
}））; 
  

manifest.json如下所示：

< pre $ content_scripts：[
{
run_at：document_end，
all_frames：false，
：[*：//www.flipkart.com/*]，
css：[jqueryui / jquery-ui.css，js / slidenavi / sidenavi-right.css，main .css，js / bootstrap-switch-master / dist / css / bootstrap3 / bootstrap-switch.min.css]，
js：[jquery-2.1.4.min.js， jqueryui / jquery-ui.min.js，js / angular.min.js，js / jquery.cookie.js，jqueryui / jquery-ui.min.js，js / slidenavi / SideNavi .js，client_server_common.js，user-selections.js，
jquery.countdown.min.js，js / bootstrap-switch-master / dist / js / bootstrap-switch.min .js，js / cryptojs / rollups / md5.js，common.js，
myscript.js
]
}
]，


使它有效的方法是什么？

解决方案

尝试使用此代码;它通过在按钮中间点击鼠标，鼠标和单击事件的快速连续模拟鼠标左键单击元素：

  var simulateMouseEvent = function（element，eventName，coordX，coordY）{
 element.dispatchEvent（new MouseEvent（eventName，{
 view：window，
 bubbles：true，
可撤销：true，
 clientX：coordX，
 clientY：coordY，
按钮：0 
}））; 
}; 
 
 var theButton = document.querySelector（'ul form button'）; 
 
 var box = theButton.getBoundingClientRect（），
 coordX = box.left +（box.right  -  box.left）/ 2，
 coordY = box.top +（ box.bottom  -  box.top）/ 2; 
 
 simulateMouseEvent（theButton，mousedown，coordX，coordY）; 
 simulateMouseEvent（theButton，mouseup，coordX，coordY）; 
 simulateMouseEvent（theButton，click，coordX，coordY）; 
  

I've this page. I need to trigger a click on the BUY NOW button on this page using AngularJS.

I've tried these ways to click on this "BUY NOW" in content script(myscript.js) but does not work:

   angular.element($('ul form button:contains("BUY NOW")').get(0)).triggerHandler('click');

       $('ul form button:contains("BUY NOW")').get(0).click();

        $('ul form button:contains("BUY NOW")').get(0).dispatchEvent(new MouseEvent('click', {
            'view': window,
            'bubbles': true,
            'cancelable': true
        }));

The manifest.json looks like this:

"content_scripts": [
        {
            "run_at": "document_end",
            "all_frames": false,
            "matches": ["*://www.flipkart.com/*"],
            "css": [ "jqueryui/jquery-ui.css", "js/slidenavi/sidenavi-right.css","main.css", "js/bootstrap-switch-master/dist/css/bootstrap3/bootstrap-switch.min.css"],
            "js": ["jquery-2.1.4.min.js", "jqueryui/jquery-ui.min.js","js/angular.min.js", "js/jquery.cookie.js", "jqueryui/jquery-ui.min.js","js/slidenavi/SideNavi.js", "client_server_common.js", "user-selections.js",
                "jquery.countdown.min.js", "js/bootstrap-switch-master/dist/js/bootstrap-switch.min.js", "js/cryptojs/rollups/md5.js",  "common.js",
                "myscript.js"
            ]
        }
    ],

What is the way to make it work?

解决方案

Try with this code; it simulates a mouse left click on the element by a quick succession of mousedown, mouseup and click events fired in the center of the button:

var simulateMouseEvent = function(element, eventName, coordX, coordY) {
  element.dispatchEvent(new MouseEvent(eventName, {
    view: window,
    bubbles: true,
    cancelable: true,
    clientX: coordX,
    clientY: coordY,
    button: 0
  }));
};

var theButton = document.querySelector('ul form button');

var box = theButton.getBoundingClientRect(),
        coordX = box.left + (box.right - box.left) / 2,
        coordY = box.top + (box.bottom - box.top) / 2;

simulateMouseEvent (theButton, "mousedown", coordX, coordY);
simulateMouseEvent (theButton, "mouseup", coordX, coordY);
simulateMouseEvent (theButton, "click", coordX, coordY);

这篇关于如何触发点击按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！