jQuery: .click()의 잘못된 문제 분석 및 소개
- 黄舟원래의
- 2017-06-27 10:07:562012검색
이 글은 jQuery에서 $("a").click()의 잘못된 문제에 대한 분석을 주로 소개합니다. 필요하신 분들은 참고하시면 됩니다.
오늘은 form을 xls로 내보낼 때 앞쪽에 책상에서 . 그러나 실패했습니다. 드디어 이 파일을 찾았습니다.
사용자가 a 태그를 클릭하는 기능을 시뮬레이션하기 위해 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!