如何在基於文本框具有焦點的情況下按下Enter鍵時觸發Button Click事件？

我有幾個提交按鈕的表單。我希望按下按鈕的點擊事件時，基於哪些文本框當前具有焦點，在按下輸入時觸發。我可以用下面的代碼來指定一個按鈕，通過添加的onkeydown事件到頁面的主體，並檢查輸入的鍵代碼如何在基於文本框具有焦點的情況下按下Enter鍵時觸發Button Click事件？

<body onkeydown="if(event.keyCode==13){document.getElementById('btnSearch').click();}"> 
... 
</body>

我認爲這可以修改代碼或調用一個函數來執行條件來看看txtSearch或txtSubmit是否有焦點，並相應地指定btnSearch或btnSubmit，但我沒有經驗的JavaScript。

任何幫助/建議將是偉大的！

來源

2010-07-14 Starwfanatic

我終於得到了結果我之後。我需要使用一個函數來停止觸發默認的「輸入」按鈕，另一個功能是觸發正確的按鈕的點擊事件。下面是使用的腳本：

<script type="text/javascript"> 
function KeyDownEventHandler(e, box) { 
    var charCode = (e.which) ? e.which : event.keyCode 
    if (charCode == 13) 
     document.getElementById(box).click(); 
} 

function DisableEnterKey() { 
    if (event.keyCode == 13) { 
     return false; 
    } 
    else { 
     return true; 
    } 
} 
</script>

我打電話從身體的onkeydown事件從文本框的onKeyDown事件的DisableEnterKey功能和KeyDownEventHandler：

<body onkeydown="return DisableEnterKey()"> 
... 
<input id="txtSearch" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnSearch');" /> 
... 
<input id="txtAddEor" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnAddEor');" /> 
... 
<input id="txtCategory" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnAddEor');" />

來源

2010-07-14 21:59:27 Starwfanatic

第一個問題可能只是拼寫錯誤，但您需要在上面的代碼中添加單引號並刪除分號。

<body onkeydown="if(event.keyCode==13){document.getElementById('btnSearch').click();}"> 
... 
</body>

但我不認爲捕獲全局按鍵事件是最好的方法。我會將onkeydown添加到實際的表單控件中，以便您不僅可以完成每個輸入。也可以這樣做，您可以在事件處理程序方法中指定一個參數，該參數指示正在使用哪個文本框。

<input type="text" onkeydown="KeyDownEventHandler(event, 1);" />

然後你只寫方法來處理所有關鍵捕捉事件：

function KeyDownEventHandler(e, box) 
{ 
    var charCode = (e.which) ? e.which : event.keyCode 
    if(charCode==13) 
     document.getElementById('btnSearch' + box).click(); 
}

我改變了鍵碼檢測到與其他瀏覽器更好的工作。

來源

2010-07-14 16:52:33 spinon

如果我改變它使用其他任何則charCode這是工作比進入。當我使用輸入時，第一個按鈕總是觸發，就好像我仍然將它聲明爲頁面上的默認按鈕。我查了一下，以確保我沒有設置默認的地方，我不是。有沒有辦法來禁用默認按鈕，所以它不覆蓋控制級別腳本？ – Starwfanatic 2010-07-14 18:12:55

您是否將代碼從身體標記中取出？如果你把它放在每個控件上，你就不再需要它了。你可以發佈你的網頁，看看發生了什麼？ – spinon 2010-07-14 18:47:27

你可以使用asp：Panel控件來幫助你做到這一點。一個asp：Panel有「DefaultButton」，你可以在其中指定一個按鈕的ID。

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.panel.defaultbutton.aspx

它可能不是正是你需要的，但它一直是足夠我的需要。

<asp:Panel runat="server" DefaultButton="btnSearch"> 
    <asp:TextBox id="txtSearch" runat="server" /> 
    <asp:Button id="btnSearch" runat="server" text="Start search" /> 
</asp:Panel> 

<asp:Panel runat="server" DefaultButton="btnSubmit"> 
    .... 
    <asp:Button id="btnSubmit" runat="server" text="Submit" /> 
</asp:Panel>

希望這可以幫助你。

問候

來源

2010-07-14 16:52:43 bgs264

感謝您的輸入。它的工作原理，但我使用一個表來組織我的文本框和按鈕。而不是分裂我的表格或添加面板到單個單元格，我將與spinon的解決方案。我很可能會在未來的應用中使用這種方法，因爲它更簡單。 :) – Starwfanatic 2010-07-14 17:58:28

@Starwfanatic：你有沒有考慮過使用div來代替表格的佈局。它將爲您提供漸進式渲染的好處，並允許您使用默認的asp.net功能。 – 2010-07-14 18:21:19

我沒有考慮過。我是新來的asp.net，所以我很欣賞這個建議。我將在未來的計劃中研究這一點。 – Starwfanatic 2010-07-14 19:13:01

如何在基於文本框具有焦點的情況下按下Enter鍵時觸發Button Click事件？

回答

相關問題