簡體   English   中英

如何為Asp.net控件的鏈接按鈕進行雙擊和單擊事件?

[英]How to make double click & single click event for link button of Asp.net control?

考慮以下:

protected void dgTask_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        LinkButton btn = (LinkButton)e.Row.Cells[4].FindControl("lnkBtnEdit");

        btn.Attributes.Add("onclick", "return Test();");
    }
}

而不是單擊,如何在單擊鏈接按鈕時雙擊它?

編輯

我嘗試過使用* competent_tech *提出的解決方案,但問題是在這種情況下它會攔截單擊。

我需要在單擊時進行一些操作,雙擊時需要進行其他操作。 請幫我。

謝謝

你必須做這樣的事情。

代碼背后。

Linkbutton btn;
btn.Attributes.Add("onClick", "OnClick();");

然后在你的javascript中你需要像這樣定義OnClick函數

var clickCount = 0;
var timeoutID  = 0;

function OnClick()
{
    clickCount++;

    if (clickCount >= 2) {
       clickCount = 0;          //reset clickCount
       clearTimeout(timeoutID); //stop the single click callback from being called
       DoubleClickFunction();   //perform your double click action
    }
    else if (clickCount == 1) {
       //create a callback that will be called in a few miliseconds
       //the callback time determines how long the user has to click a second time

       var callBack = function(){ 
                         //make sure this wasn't fired at
                         //the same time they double clicked
                         if (clickCount == 1) {      
                            clickCount = 0;         //reset the clickCount
                            SingleClickFunction();  //perform your single click action
                         }
                      };

       //This will call the callBack function in 500 milliseconds (1/2 second).
       //If by that time they haven't clicked the LinkButton again
       //We will perform the single click action. You can adjust the
       //Time here to control how quickly the user has to double click.
       timeoutID = setTimeout(callBack, 500); 
    }
}

您可以將javascript直接放入.aspx文件中,也可以在將LinkBut​​ton添加到頁面時動態添加。 如果您需要在用戶單擊或雙擊時在服務器端執行某些操作,則可以使用__doPostBack方法。 有關詳細信息,請參見此處

我的方法的問題是用戶將始終必須等待整個回調時間才能執行單擊操作。 只要您使用單擊/雙擊來區分用戶想要的內容,我就沒有看到任何解決方法。 如果您發現此延遲太大而無法解決問題,您可以嘗試點擊/移動+點擊以在操作之間切換。 它可能不會那么直觀,但你會立即知道用戶想要什么,並且可以立即響應,而不是等待用戶第二次點擊。

如果您有任何疑問,請告訴我。

簡答:不,你做不到。

答案很長:你不能這樣做,因為雙擊實際上是2次單擊。 有很多黑客(比如基於計時器的方法)可以找到哪些嘗試做到這一點,但如果你選擇它們,請注意這總是一個不可靠和冒險的行為。

根據quirksmode.org ,這是雙擊的事件序列:

  1. 鼠標按下
  2. 鼠標松開
  3. 點擊
  4. 鼠標按下
  5. 鼠標松開
  6. 點擊
  7. DBLCLICK

即使這個順序在瀏覽器中也不一致。 沒有可靠的方法來檢測同一元素的點擊和雙擊。

引用quirksmode.org

不要在同一元素上注冊click和dblclick事件:不可能將單擊事件與導致dblclick事件的單擊事件區分開來。

並根據jQuery

將處理程序綁定到同一元素的click和dblclick事件是不可取的。 觸發的事件序列因瀏覽器而異,有些事件在dblclick之前接收到兩個點擊事件,而其他事件只接收一個事件。 雙擊敏感度(雙擊檢測到的點擊之間的最長時間)可能因操作系統和瀏覽器而異,通常可由用戶配置。

您最好的選擇是重新設計工作流程,以便您可以依賴其他內容(而不是點擊次數)。

嘗試使用ondblclick而不是onclick

為了使其正常工作,您還必須攔截onclick並返回false,以便不進行自動導航:

        LinkButton1.Attributes.Add("ondblclick", @"alert('test');");
        LinkButton1.Attributes.Add("onclick", @"return false;");

http://jsfiddle.net/XfJDK/2/

<div onClick="return OnClick();">click me</div>
<div id="eventText">...</div>

var clicks = 0;

function OnClick() {

    clicks++;
    if (clicks == 1) 
        setTimeout("RunRealCode();", 300); // schedule real code, allowing for 300ms for 2nd optional click

    setTimeout("clicks = 0;", 350); // click timeout of 300 + 50 ms
}

function RunRealCode() {
        if (clicks == 2)
            $("#eventText").text("Double").fadeOut().fadeIn();
        else if (clicks == 1) 
            $("#eventText").text("Single").fadeOut().fadeIn();
}

嘗試獲取點擊次數並嘗試執行操作。我認為ondbclick可以通過javascript實現。

int count = 0;
if(btn.Click == true)
{
  count++;
  if(count == 2)
   {
        // Perform the logic here
   }
}

編輯:competent_tech說的是對的。你可以執行這個邏輯

將此代碼粘貼到Page_Load中即可

LinkButton1.Attributes.Add("ondblclick","yourfunction()"); LinkButton1.Attributes.Add("onclick", @"return false;");

我在這里放置了示例javascript代碼。

http://jsbin.com/ubimol/2/edit

HTML:

  <input id="sin" type="button" value="Edit" onclick="singleClick();return false;"/>
    <input id="dou" style="display:none" type="button" value="Edit" onclick="doubleClick();return false;" />

使用Javascript:

var isDoubleClick = false;
function singleClick(){
   $("#sin").hide();$("#dou").show();

  //wait for 500 milliseconds.
  setTimeout("waitForSecondClick()", 500);


}


    function waitForSecondClick(){
    if(isDoubleClick == false){
       alert("this is a sinle click event, perform single click functionality");
      }

      isDoubleClick = false; //Reset
      $("#sin").show();$("#dou").hide();
    }

    function doubleClick(){
      isDoubleClick = true;

      alert("this is a double click event, perform double click funcitonality");



    }

通過引入具有相同值的第二個按鈕,解決方案是穩定的,但需要一些額外的編碼。

您可以使用此處給出的Jquery事件雙擊打開鏈接可以在此處找到文檔http://api.jquery.com/dblclick/

在測試上面的示例時,我發現每次單擊LinkButton時都會提交GridView包含的表單。 為了解決這個問題,我使用了以下代碼。

每次用戶單擊鏈接時,將計算以下腳本。

<script type="text/javascript">    
    var clickNo = 0;    

    function clickCounter() {    
        clickNo++;    
        if (clickNo == 2) {    
            alert("Double Click");    
            clickNo = 0;    
        }    
    }    
</script>    

我們取消表單提交,以便跟蹤用戶點擊鏈接的次數。 這可能會導致您的網頁出現問題,但這似乎是無法跟蹤雙擊的原因。

<form id="form1" runat="server" onsubmit="return false;">    

我在GridView控件中創建了一個模板字段,以顯示單擊和雙擊按鈕。

<asp:TemplateField HeaderText="Edit">    
    <ItemTemplate>    
        <asp:LinkButton ID="lnkBtnEdit" runat="server">LinkButton</asp:LinkButton>    
        &nbsp;&nbsp;    
        <asp:LinkButton ID="lnkBtnEditDouble" runat="server">LinkButton</asp:LinkButton>    
    </ItemTemplate>    
</asp:TemplateField>    

在頁面背后的代碼,我們添加javascript代碼,對於單次點擊和javascript代碼,雙擊。 請注意:Cell引用設置為2,而在您的示例中它是4,因為我在測試中使用的列數有限。

try     
{    
    if (e.Row.RowType == DataControlRowType.DataRow)    
    {    
        // Please note: the value in Cells has changed for my testing data.    
        LinkButton btn = (LinkButton)e.Row.Cells[2].FindControl("lnkBtnEdit");    

        btn.Attributes.Add("onclick", "javascript:alert('Single Click');");    

        LinkButton btnDouble = (LinkButton)e.Row.Cells[2].FindControl("lnkBtnEditDouble");    

        btnDouble.Attributes.Add("onclick", "javascript:clickCounter();");    
    }    
}    
catch (Exception ex)    
{    
    Console.WriteLine(ex.Message);    
}    

這應該允許您捕獲某些鏈接上的雙擊和單擊其他鏈接。 但是,如上所述,表單提交現已取消,如果您要使用上述代碼,則需要找到另一種方法來提交數據。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM