วิธีจำลองการคลิกด้วย JavaScript ได้อย่างไร

ฉันแค่สงสัยว่าฉันจะใช้ JavaScript เพื่อจำลองการคลิกบนองค์ประกอบได้อย่างไร

ปัจจุบันฉันมี:

<script type="text/javascript">
function simulateClick(control)
{
    if (document.all)
    {
        control.click();
    }
    else
    {
        var evObj = document.createEvent('MouseEvents');
        evObj.initMouseEvent('click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );
        control.dispatchEvent(evObj);
    }
}
</script>

<a href="http://www.google.com" id="mytest1">test 1</a><br>

<script type="text/javascript">
    simulateClick(document.getElementById('mytest1'));
</script>

แต่มันไม่ทำงาน :(

ความคิดใด ๆ

นี่คือสิ่งที่ฉันทำขึ้น มันค่อนข้างง่าย แต่ใช้งานได้:

function eventFire(el, etype){
  if (el.fireEvent) {
    el.fireEvent('on' + etype);
  } else {
    var evObj = document.createEvent('Events');
    evObj.initEvent(etype, true, false);
    el.dispatchEvent(evObj);
  }
}

การใช้งาน:

eventFire(document.getElementById('mytest1'), 'click');

สิ่งที่เกี่ยวกับสิ่งที่ง่ายเช่น:

document.getElementById('elementID').click();

รองรับแม้โดย IE

คุณได้พิจารณาใช้ jQuery เพื่อหลีกเลี่ยงการตรวจหาเบราว์เซอร์ทั้งหมดหรือไม่ ด้วย jQuery มันจะง่ายเหมือน:

$("#mytest1").click();

var elem = document.getElementById('mytest1');

// Simulate clicking on the specified element.
triggerEvent( elem, 'click' );

/**
 * Trigger the specified event on the specified element.
 * @param  {Object} elem  the target element.
 * @param  {String} event the type of the event (e.g. 'click').
 */
function triggerEvent( elem, event ) {
  var clickEvent = new Event( event ); // Create the event.
  elem.dispatchEvent( clickEvent );    // Dispatch the event.
}

การอ้างอิง

• https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events
• https://codepen.io/felquis/pen/damDA

คุณสามารถประหยัดพื้นที่ได้ด้วยการใช้ jQuery คุณจะต้องใช้:

$('#myElement').trigger("click")

คำตอบที่ดีที่สุดคือ! อย่างไรก็ตามมันไม่ได้เรียกเหตุการณ์เมาส์สำหรับฉันใน Firefox เมื่อetype = 'click'เมื่อ

ดังนั้นผมเปลี่ยนdocument.createEventไป'MouseEvents'และแก้ไขปัญหา รหัสพิเศษคือการทดสอบว่ามีการใส่รหัสอีกเล็กน้อยหรือไม่และเหตุการณ์นั้นถูกยกเลิกไปหรือไม่และหากมีการยกเลิกฉันจะบันทึกมันไว้ที่คอนโซล

function eventFire(el, etype){
  if (el.fireEvent) {
    el.fireEvent('on' + etype);
  } else {
    var evObj = document.createEvent('MouseEvents');
    evObj.initEvent(etype, true, false);
    var canceled = !el.dispatchEvent(evObj);
    if (canceled) {
      // A handler called preventDefault.
      console.log("automatic click canceled");
    } else {
      // None of the handlers called preventDefault.
    } 
  }
}

document.getElementById('elementId').dispatchEvent(new MouseEvent("click",{bubbles: true, cancellable: true}));

ไปที่ลิงก์นี้เพื่อทราบเกี่ยวกับเหตุการณ์เมาส์โดยใช้ Javascript และความเข้ากันได้ของเบราว์เซอร์ในลักษณะเดียวกัน

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent#Browser_compatibility