この記事では、JavaScriptのクリックとダブルクリックの共存方法について説明します。参照のためにそれを共有してください。特定の分析は次のとおりです。
Web開発の過程で、この問題に遭遇することがよくあります。リンクのダブルクリックイベントを登録するか、ボタンまたはその他の要素でクリックまたはダブルクリックイベントを登録します。現時点では、Webページのダブルクリックイベントが機能しないことがわかります。その理由は、1回クリックすると、ハイパーリンクまたはクリックイベントによって傍受されるためです。この記事では、この技術的な問題を解決する方法の特定の方法について説明します。このソリューションの実装の原則は、クリックイベントとダブルクリックイベントの両方が同じ方法を呼び出すことです。 2回のマウスクリック間の間隔に基づいて、クリックまたはダブルクリックイベントかを判断します。クリックイベントが来たら、最初に電話しないでください。短期間待ってください。この期間の後、次のクリックがない場合は、クリックの対応する操作の呼び出しを開始します。次のクリックがある場合は、ダブルクリックを呼び出します。
詳細な説明については、次のコードリストに参加してください。
次のようにコードをコピーします：<html>
<head>
<Title> JavaScriptは、クリックを実現し、共存をダブルクリックします</title>
<Meta name = "generator" content = "editplus">
<Meta name = "Author" content = "//www.vevb.com/">
<Meta name = "keywords" content = "">
<メタ名= "説明" content = "">
</head>
<body>
<スクリプト言語= "javascript">
<！ -
var dctime = 250; // DoubleClick時間
var dcdelay = 100; // doubleclickの後にクリックしないでください
var dcat = 0; // doubleclickの時間
var savevent = null; // doclick（）を処理するためのイベントを保存します。
var savevttime = 0; //クリックイベントの時間を節約します。
var savto = null; //クリックsettimeoutのハンドル
関数showme（txt）{
document.forms [0] .elements [0] .value += txt;
}
function handlewisely（それ）{
switch（one）{
ケース「クリック」：
SaveVent = which;
d = new date（）;
savevttime = d.getTime（）;
savto = setimeout（ "doclick（savevent）"、dctime）;
壊す;
ケース "dblclick"：
dodoubleclick（それ）;
壊す;
デフォルト：
}
}
関数doclick（それ）{
if（savevttime -dcat <= 0）{
falseを返します。
}
showme（ "click"）;
}
function dodoubleclick（それ）{
var d = new date（）;
dcat = d.getTime（）;
if（savto！= null）{
savto = null;
}
showme（ "double-click"）;
}
//->
</script>
<p>
<a href = "javascript：void（0）"
onclick = "handlewisely（event.type）"
ondblclick = "handlewisely（event.type）"
style = "color：blue; font-family：arial; cursor：hand">
クリックして結果を確認してください：
</a>
</p>
<form>
<表>
<tr>
<td valign = "top">
イベントモード：<textarea rows = "4" cols = "60" wrap = "soft"> </textarea>
</td>
</tr>
<tr>
<td valign = "top">
<入力型= "reset">
</td>
</tr>
</table>
</form>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。