JavaScriptの要素をプログラムでクリックするにはどうすればよいですか？

StackOverflow https://stackoverflow.com/questions/809057

質問

IEでは、JavaScriptからelement.click（）を呼び出すことができます。Firefoxで同じタスクを実行するにはどうすればよいですか？理想的には、クロスブラウザで同等に機能するJavaScriptが必要ですが、必要に応じて、ブラウザごとに異なるJavaScriptを使用します。

役に立ちましたか？

解決

document.createEvent ドキュメントには＆quot; createEvent メソッドは廃止されました。代わりにイベントコンストラクターを使用してください。＆quot;

したがって、代わりにこのメソッドを使用する必要があります。

var clickEvent = new MouseEvent("click", {
    "view": window,
    "bubbles": true,
    "cancelable": false
});

次のような要素で実行します：

element.dispatchEvent(clickEvent);

こちらに示すとおり。

他のヒント

firefoxのリンクは「特別」に見えます。これを機能させるための唯一の方法は、createEvent MDNで説明したおよびinitMouseEvent関数を呼び出します。それでも完全には機能しませんでしたが、リンクを開くようブラウザに手動で指示する必要がありました... 

var theEvent = document.createEvent("MouseEvent");
theEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
var element = document.getElementById('link');
element.dispatchEvent(theEvent);

while (element)
{
    if (element.tagName == "A" && element.href != "")
    {
        if (element.target == "_blank") { window.open(element.href, element.target); }
        else { document.location = element.href; }
        element = null;
    }
    else
    {
        element = element.parentElement;
    }
}

jQuery を使用すると、まったく同じことができます。例：

$("a").click();

「クリック」しますページ上のすべてのアンカー。

element.click（）は、 W3C DOM仕様。 MozillaのGecko / Firefox 標準に従って、このメソッドをINPUTでのみ呼び出すことができます要素。

実際にリンクをたどるか、onclickをトリガーしようとしていますか？次のような方法でonclickをトリガーできます。

var link = document.getElementById(linkId);
link.onclick.call(link);

クロスブラウザー機能（クリックハンドラー以外にも使用可能）：

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);
    }
}

上記のKooiIncの関数を使用しましたが、IE用に「ボタン」、FireFox用に「送信」という2つの異なる入力タイプを使用する必要がありました。理由は正確にはわかりませんが、動作します。

// HTML 

<input type="button" id="btnEmailHidden" style="display:none" />
<input type="submit" id="btnEmailHidden2" style="display:none" />
JavaScriptの

// 

var hiddenBtn = document.getElementById("btnEmailHidden");

if (hiddenBtn.fireEvent) {
    hiddenBtn.fireEvent('onclick');
    hiddenBtn[eType]();
}
else {
    // dispatch for firefox + others
    var evObj = document.createEvent('MouseEvent');
    evObj.initEvent(eType, true, true);
    var hiddenBtn2 = document.getElementById("btnEmailHidden2");
    hiddenBtn2.dispatchEvent(evObj);
}

検索を行って多くの提案を試みましたが、これが機能することになりました。もう少し時間があれば、なぜFFで動作するのかIEでボタンで動作するのかを調査したかったのですが、今は次の問題についても贅沢になります。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top