web-dev-qa-db-ja.com

JQueryを使ってリンクをクリックする方法

私はリンクがあります：

<ul id="titleee" class="gallery">
  <li>
    <a href="#inline" rel="prettyPhoto">Talent</a>
  </li>
</ul>

そして、私はそれを使ってそれを起動しようとしています：

$(document).ready(function() {
  $('#titleee').find('a').trigger('click');
});

しかし、うまくいきません。

私も試してみました：$('#titleee a').trigger('click');

編集 ：

私は実際にここで呼ばれるものは何でも引き起こす必要があります<a href="#inline" rel="prettyPhoto">

jquerytriggersclick
196
Patrioticcow

あなたがアンカー上でイベントを発生させようとしているならば、あなたが持っているコードは私が jsfiddle ）で追加されたeventHandlerであなたの例を再作成します。

$(document).on("click", "a", function(){
    $(this).text("It works!");
});

$(document).ready(function(){
    $("a").trigger("click");
});

アンカーをクリックしてユーザーをWebページ上の特定の場所に移動させようとしていますか、それともそれにバインドされたイベントをトリガーしようとしていますか？実際にclickイベントを実際にイベントにバインドしていないのでしょうか。

またこれ：

$('#titleee').find('a').trigger('click');

これと同等です：

$('#titleee a').trigger('click');

Findを呼び出す必要はありません。 :)

247
Kit Sunde

申し訳ありませんが、イベントハンドラは本当に必要ありません。あなたが必要としているのはクリックするタグ内の別の要素です。

<a id="test1" href="javascript:alert('test1')">TEST1</a>
<a id="test2" href="javascript:alert('test2')"><span>TEST2</span></a>

Jquery：

$('#test1').trigger('click'); // Nothing
$('#test2').find('span').trigger('click'); // Works
$('#test2 span').trigger('click'); // Also Works

これはあなたがクリックしているものについてのすべてであり、それはタグではなくその中のものです。残念ながら、ベアテキストはJQueryによって認識されていないようですが、Vanilla javascriptによって認識されています。

document.getElementById('test1').click(); // Works!

あるいは、配列としてjQueryオブジェクトにアクセスすることによって

$('#test1')[0].click(); // Works too!!!
178
Graham Hotchkiss

あなたが提供したコードでは、何も起こらないと期待することはできません。 2番目の@mashappslabs：最初にイベントハンドラを追加します。

$("selector").click(function() {
    console.log("element was clicked"); // or alert("click");
});

それからあなたのイベントを引き起こします：

$("selector").click(); //or
$("selector").trigger("click");

コンソールにメッセージが表示されるはずです。

6
Julz

アンカーでイベントを発生させようとしているのなら、あなたが持っているコードはうまくいきます。

$(document).ready(function() {
  $('a#titleee').trigger('click');
});

OR

$(document).ready(function() {
  $('#titleee li a[href="#inline"]').click();
});

OR

$(document).ready(function() {
  $('ul#titleee li a[href="#inline"]').click();
});
5
Anand Pal

リンクのためにこれは働くべきです：

eval($(selector).attr('href'));
3
Amin

さてあなたは最初にclickイベントを設定しなければなりませんそしてそれからあなたはそれをトリガーしそして何が起こるか見ることができます：

//good habits first let's cache our selector
var $myLink = $('#titleee').find('a');
$myLink.click(function (evt) {
  evt.preventDefault();
  alert($(this).attr('href'));
});

// now the manual trigger
$myLink.trigger('click');
3
Ady Ngom

これはイベントをトリガーする方法のデモです

<!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $("input").select(function(){
            $("input").after(" Text marked!");
        });
        $("button").click(function(){
            $("input").trigger("select");
        });
    });
    </script>
    </head>
    <body>

    <input type="text" value="Hello World"><br><br>

    <button>Trigger the select event for the input field</button>

    </body>
    </html>
3
Harshad Hirapara

要素のネイティブの.click（）メソッドを呼び出すか、createEvent APIを使用してください。

詳細については、次のURLをご覧ください。 https://learn.jquery.com/events/triggering-event-handlers/ /

2
George Filippakis

これはあなたの質問に正確に答えるものではありませんが、頭痛が少なくても同じ結果が得られます。

私はいつもクリックイベントが私が実行したい全てのロジックを含むメソッドを呼び出すようにしています。実際にクリックせずにアクションを実行したい場合は、直接メソッドを呼び出すことができます。

2
Matthew Vines

この質問はグーグルで「<a>要素をクリックする」ことで第1位にランクされていますが、実際にはそうはしていません。

$('#titleee a')[0].click();

説明：jQueryオブジェクトではなく、基礎となるhtml要素でclickをトリガーしました。

ようこそグーグルです:)

0
Alex