JavaScript'te x, y koordinatlarını kullanarak bir tıklama simülasyonu nasıl yapılır?


Yanıtlar:


151

Gerçek tıklama ile aynı olmasa da bir tıklama olayı gönderebilirsiniz . Örneğin, etki alanları arası bir iframe belgesini tıklandığını düşünmesi için kandırmak için kullanılamaz.

Tüm modern tarayıcılar document.elementFromPointve HTMLElement.prototype.click()en azından IE 6, Firefox 5, Chrome'un herhangi bir sürümünü ve muhtemelen ilgilendiğiniz herhangi bir Safari sürümünü destekler. Bağlantıları bile takip edecek ve formlar gönderecek:

document.elementFromPoint(x, y).click();

https://developer.mozilla.org/En/DOM:document.elementFromPoint https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click


1
@RadiantHex: evet, aslında bunu ilk uygulayan IE idi ve IE6'ya geri dönüyor. Chrome, Firefox ve Safari 5 uygulamaları iyidir, ancak Safari 4 ve Opera yanlıştır (uygulanabilir olsa da). Quirksmode.org/dom/w3c_cssom.html#documentview adresine bakın .
Andy E

1
Bu keşiften çok mutluyum !! = D İmkansız görülen birçok şeyi şimdi mümkün kılıyor =) ... veya en azından daha az karmaşık hale getiriyor. Teşekkürler!!
RadiantHex

1
Bu, $ .live () olaylarıyla çalışmıyor gibi görünüyor, bunu $ .live () ile oluşturulan olaylarla da nasıl çalıştırabilirim?
ActionOwl

1
@AndyE Bu şu anda şu durumda çalışıyor: Web sayfam var, Iframe'i alanımdan başka bir etki alanından yüklüyorum. Ve iframe alanına tıklamak istiyorum. Bununla ilgili bir çözümünüz var mı?
Parixit

2
@parixit: hayır, bu mümkün değil. İframe üzerinde bir tıklamayı simüle edebilirsiniz, ancak yalnızca içeren belgeyi yayacaktır. İçerilen belgedeki hiçbir şey etkilenmeyecektir (çok açık güvenlik nedenlerinden dolayı).
Andy E

69

Evet, bir olay oluşturup göndererek bir fare tıklamasını simüle edebilirsiniz:

function click(x,y){
    var ev = document.createEvent("MouseEvent");
    var el = document.elementFromPoint(x,y);
    ev.initMouseEvent(
        "click",
        true /* bubble */, true /* cancelable */,
        window, null,
        x, y, 0, 0, /* coordinates */
        false, false, false, false, /* modifier keys */
        0 /*left*/, null
    );
    el.dispatchEvent(ev);
}

clickYöntemi bir eleman üzerinde kullanmaktan kaçının - yaygın olarak uygulanır ancak standart değildir ve örneğin PhantomJS'de başarısız olur. JQuery'nin uygulamasının .click()doğru şeyi yaptığını, ancak onaylamadığını varsayıyorum .


Beni bir kargaşadan kurtardı. İlk yöntemim başarısız oldu ama bu kurtarmaya geldi, teşekkürler.
iChux

3
jQuery kullanmamak için artı1. Kabul edilen yanıta aksine, bu bir yapar soruya cevap.
tomekwi

1
Bu, jQuery'ninkinden çok daha güçlü$.click()
Steven Lu

7
initMouseEventkullanımdan kaldırıldı: developer.mozilla.org/en-US/docs/Web/API/MouseEvent/…
vikeri

3
initMouseEventKullanımdan kaldırılanlar yerine kullanabilirsiniz. var event = new MouseEvent( "click", { clientX: x, clientY: y, bubbles: true } )Bu, stackoverflow.com/a/36144688/384670 adresinde de gösterilmektedir .
M Katz

30

Bu sadece Torazaburo'nun bir MouseEvent nesnesi kullanacak şekilde güncellenmiş cevabıdır .

function click(x, y)
{
    var ev = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
        'cancelable': true,
        'screenX': x,
        'screenY': y
    });

    var el = document.elementFromPoint(x, y);

    el.dispatchEvent(ev);
}

0

benim için çalışıyor ama doğru öğeyi konsola yazdırıyor

kod bu:

function click(x, y)
{
    var ev = new MouseEvent('click', {
        'view': window,
        'bubbles': true,
        'cancelable': true,
        'screenX': x,
        'screenY': y
    });

    var el = document.elementFromPoint(x, y);
    console.log(el); //print element to console
    el.dispatchEvent(ev);
}
click(400, 400);

-2

Güvenlik nedenleriyle, fare işaretçisini javascript ile hareket ettiremez veya onunla bir tıklamayı simüle edemezsiniz.

Başarmaya çalıştığınız şey nedir?


@Aicule: Bana haber verdiğin için teşekkürler! Soruya biraz bilgi ekleyeceğim. Sadece deney yapıyorum, hiçbir şey gerçekten üretken değil =)
RadiantHex

2
Chrome ve Safari'de, belirli bir x, y konumunda tıklama tetikleyebilirsiniz. Bu demo böyle işliyor. Firefox, başarısız olduğu tek tarayıcıdır, bu nedenle Firefox'a özgü bir güvenlik politikası olabilir.
thdoan

Gerçek aşağıdaki cevapta yatıyor, createEvent()+initMouseEvent()
Valer

1
Benim durumumda, test etmek.
Jose Nobile

Tam olarak aynı şekilde davranmasa da, belirli X / Y koordinatlarına sahip bir tıklamayı kesinlikle simüle edebilirsiniz.
Agamemnus
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.