asp.net textbox javascript實現enter與ctrl+enter互換 文字框發送訊息與換行(類似於QQ)

來源:互聯網
上載者:User

1、也許講解有點初級,希望高手不要“噴”我,因為我知道並不是每一個人都是高手,我也怕高手們說我裝13;
2、如有什麼不對的地方,還希望大家指出,一定虛心學習,如果有更好的辦法請告訴我一聲哦;
3、本文屬於作者原創,尊重他人勞動成果,轉載請註明作者,謝謝。
下面開講:
  如題,這個功能也困擾了我一兩天事件了,我也上網找了很多資料,但是網上大部分的說法都差不多,問題始終還是沒解決,於是乎我開始找是問題的根源,我開始用的是文字框的onkeydown事件,分別寫了兩個js函數,如下: 複製代碼 代碼如下://enter發送
function IsEnter(evt)
{
if(window.event.keyCode ==13)
{
send();
return false;
}
}
//ctrl+enter發送
function IsEnterAndCtrl()
{
if(window.event.keyCode ==13 && window.event.ctrlKey)
{
send();
return false;
}
}

然後我就用文字框的onkeydown事件來調用這兩個函數,可以一直效果不出來,我就調試,發現event永遠都是undefined,我無語了,然後我就換方法了,我把onkeydown函數裡面加了一個event參數,在IsEnter(evt)裡面也定義了一下var obj = window.event ? evt.keyCode : evt.which;//window.event是針對IE,evt.keyCode是針對FF,這樣這個問題就解決了,就不會出現undefined錯誤了。
  接下來問題又來了,我發現onkeydown事件只要你按鍵盤上的任意鍵就會觸發這個事件,那麼就無法實現ctrl和enter同時按了,又是一個糾結的問題啊,還有我們有onkeydown事件就有onkeyup事件,接下來我就把onkeydown事件換成了onkeyup事件了,這樣問題就解決了。
  好了,問題是越解決越少了,下面要做到是如何做到enter與ctrl+enter切換實現是換行還是發送訊息?為了相容性,我又定義了一個變數 var e = evt || window.event;我就是通過obj與e來實現換行與發送切換的,詳細js代碼如下: 複製代碼 代碼如下://enter or ctrl+enter發送
function IsEnter(evt)
{
var obj = window.event ? evt.keyCode : evt.which;
var e = evt || window.event;
var type = document.getElementById("sendtype");
var txt = document.getElementById("txtcontent");
if(type.innerHTML=="[Enter發送訊息]")
{
if(obj ==13 && !(e.ctrlKey))
{
send();
e.returnValue = false;
txt.value="";
return false;
}
if(e.ctrlKey && e.keyCode==13)
{
txt.value +="\n";
}
}
else
{
if(e.ctrlKey && e.keyCode==13)
{
send();
return false;
}
}
}

注意:以上代碼我都已經在IE6、IE8、FF裡測試過,絕對有用,由於按enter發送訊息的時候會與換行衝突,所以我用e.returnValue = false;txt.value="";不知道有沒有更好的方法?

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.