JQuery 및 CSS_jquery를 사용하여 하이퍼링크의 사용자 클릭 이벤트를 시뮬레이션하기 위한 구현 코드-JS 튜토리얼-php.cn

JQuery 및 CSS_jquery를 사용하여 하이퍼링크의 사용자 클릭 이벤트를 시뮬레이션하기 위한 구현 코드

WBOY

풀어 주다： 2016-05-16 17:53:39

원래의

1072명이 탐색했습니다.

본 글을 정식으로 시작하기 전에 HTML의 태그에 대해 간단히 소개하겠습니다. 태그를 사용하여 HTML 페이지에 앵커(anchor)를 정의할 수 있습니다.
href 속성을 사용하여 다른 문서에 대한 링크(또는 하이퍼링크)를 생성합니다
name 또는 id 속성을 사용하여 문서 내부에 북마크를 생성합니다(즉, 문서 조각에 대한 링크를 생성할 수 있습니다)
이 기사의 내용은 앵커의 첫 번째 사용과 관련이 있습니다.

코드 복사 코드는 다음과 같습니다.

<%@ Page Language="C# " AutoEventWireup= "true" CodeBehind="WebForm2.aspx.cs" Inherits="Web.WebForm2" %>

<제목>

"form1 " runat="server">

스크립트 홈

나를 클릭하면 위의 하이퍼링크가 호출됩니다. 이벤트

코드의 효과는 아래와 같습니다.

하이퍼링크를 클릭하면 페이지가 정상적으로 이동할 수 있지만 레이블을 클릭하면 페이지가 위로 이동할 수 없으며 IE8 및 Chrome에서는 이동할 수 없습니다. 테스트됨). 따라서 다음으로 달성해야 할 효과는 레이블을 클릭할 때 페이지를 점프하게 하는 것(즉, 하이퍼링크의 클릭 이벤트가 호출되면 페이지를 점프하게 하는 것)이며, 작성해야 할 코드도 적어야 하며, 한 곳에서 처리할 수 있는 것이 가장 좋습니다. 프로젝트는 하나의 페이지만 가질 수 없으며 페이지는 하나의 하이퍼링크만 가질 수 없으며 앵커의 또 다른 기능은 북마크로 이동할 수 있습니다. .앵커의 북마크 기능이 차단되고…

Main.css

코드 복사

코드는 다음과 같습니다. a.forward {

}

Main.js

코드 복사

코드는 다음과 같습니다. /// $(document).ready(function () {

// JavaScript 호출을 용이하게 하기 위해 하이퍼링크가 클릭 이벤트를 지원하도록 만듭니다.

$('a.forward').click(function () { 
location.href = $(this)[0].href ; 
 return false; 
}); 

 
수정된 페이지 소스 코드는 다음과 같습니다. 

코드 복사

코드는 다음과 같습니다.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="Web.WebForm2" %>

<제목>

运行一下（截图略），点击标签，页face完美跳转，(*^__^*) 嘻嘻好了，最后来总结一下，模拟超链接的用户单击事件, 내 소개는 다음과 같습니다.
导入외부 CSS文件，Main.css，导入외부JavaScript文件Main.js（必须在导入JQuery文件之后导入）;
给超链接添加CSS类“앞으로”;
然后3是什么呢?然后想不休来然后了。
最后祝大家敲代码愉快。

首发：博客园->剑过不留痕