JQuery と CSS_jquery を使用してハイパーリンクのユーザークリックイベントをシミュレートする実装コード-jsチュートリアル-php.cn

JQuery と CSS_jquery を使用してハイパーリンクのユーザークリックイベントをシミュレートする実装コード

WBOY

リリース： 2016-05-16 17:53:39

オリジナル

1045 人が閲覧しました

この記事を正式に開始する前に、HTML のタグについて簡単に説明します。タグを使用すると、HTML ページにアンカー (アンカー) を定義できます。
href 属性を使用して、別のドキュメントへのリンク (またはハイパーリンク) を作成します
name または id 属性を使用して、ドキュメント内にブックマークを作成します (つまり、ドキュメントのフラグメントへのリンクを作成できます)
この記事の内容は、アンカーの最初の使用に関連しています。

コードをコピーコードは次のとおりです:

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

"form1 " runat="server">

スクリプトホーム

をクリックすると、上のハイパーリンクが呼び出されます。イベント

をクリックします。コードの効果は以下のとおりです:

ハイパーリンクをクリックするとページは正常にジャンプしますが、ラベルをクリックするとページは上にジャンプできません。IE8 と Chrome ではジャンプできません。テスト済み）。したがって、次に達成すべき効果は、ラベルがクリックされたときにページをジャンプさせる (つまり、ハイパーリンクのクリックイベントが呼び出されたときにページをジャンプさせる) ことであり、記述するコードは少なくなるはずです。 1 つの場所で処理することができます。また、1 つのページに 1 つのハイパーリンクしか含めることはできません。アンカーのもう 1 つの機能は、他のリンクにジャンプすることです。 . アンカーのブックマーク機能がブロックされてしまいました…。

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" %>

运行一下（截图略），点击标签，页面完美跳转，(*^__^*) 嘻好了，最後来总结一下，模拟超链接的用户单击イベント，我们必要做的就是:
外部CSS文件，Main.css，外部JavaScript文件Main.js（必须在导入JQuery文件之後导入）；
给超链接追加CSS类“forward”；最後の祝祭大家敲代愉快。