ホームページ > 記事 > ウェブフロントエンド > jQuery: .click() の無効な問題の分析と紹介
jQuery: .click() の無効な問題の分析と紹介
- 黄舟オリジナル
- 2017-06-27 10:07:562028ブラウズ
この記事では主にjQueryの$("a").click()の無効な問題の解析を紹介していますので、必要な方は参考にしてください
今日はformをxlsにエクスポートする際に。デスクでは、 のクリックを自動的にトリガーしたいと考えています。しかし失敗した。ようやくこのファイルを見つけました。
ユーザーがタグをクリックする機能をjQueryを使ってシミュレートしようと何度も試みましたが、うまくいかず、長い間悩んでいました。先ほどボーッとしていたところ、新しいアイデアが浮かんだのでテストしてみました。
まず以下のコードを見てください:
<html>
<
head
>磨途歌-A标签测试1<head>
<body>
<a href="http://blog.mo2g.com">磨途歌<a>
</body>
</html>
<script src="http://ajax.google
api
s.com/ajax/libs/jquery/1.7.2/jquery.min.js"><script>
<script>
jQuery(function($) {
//给所有A标签绑定点击触发
事件
$('a').click(function() {
alert(1);
});
//触发所有A标签的点击事件
$('a').click();
});
</script>上記のコードは確かにラベル A のクリック イベントをトリガーしましたが、誰もが疑問を持つはずです。なぜラベル A をクリックしたのに、ラベル A のジャンプ イベントをトリガーしなかったのですか?
最初は、ブラウザが A タグでの JS の操作をブロックするための対応するセキュリティ措置を講じているためだと思いました。後で、これが当てはまらないことがわかりました。その理由についてお話しましょう。
説明を始める前に、質問させてください。 「A ラベル」をクリックしたとき、ジャンプを引き起こすために正確に何をクリックしたのでしょうか?
1)「Aタグ」自体がクリックされましたか？
2) 「Aラベル」に表示されたテキストをクリックしましたか?
これを述べた上で、上記のコードは、A ラベルをクリックすること自体が、指定されたリンクにジャンプするイベントをトリガーしないことを確認していることを理解する必要があります。つまり、通常は A ラベル内のテキストをクリックします。
アイデアが浮かんだので、試してみましょう。
<html>
<head>磨途歌-A标签测试2<head>
<body>
<a href="http://www.mo2g.com">磨途歌<a>
</body>
</html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"><script>
<script>
jQuery(function($) {
var mo2g = '<span id="mo2g">磨延城<span>';
//给A标签中的文字添加一个能被jQuery捕获的元素
$('a').append(mo2g);
//模拟点击A标签中的文字
$('#mo2g').click();
});
</script>今回の結果は、上記の推論が正しいことを証明しました。 したがって、JS を使用して A ラベルをクリックするイベントをシミュレートしたい場合は、まず JS でキャプチャできる要素を追加する必要があります。 A ラベルのテキストを入力し、JS を使用して要素のクリックをシミュレートします。
以上がjQuery: .click() の無効な問題の分析と紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。