jquery ctrl +在文本區域輸入as

Question

我試圖在TEXT區域控件上重現標准的即時消息行為：輸入作為發送按鈕。 ctrl +輸入為真實輸入。

 $("#txtChatMessage").keydown(MessageTextOnKeyEnter);
 function MessageTextOnKeyEnter(e)
 {
    if (!e.ctrlKey && e.keyCode == 13)
    {
       SendMessage();
       return false;
    }
    else if(e.keyCode == 13)
    {
       $(this).val($(this).val() + "\n");
    }
    return true;
 }

我已嘗試使用注釋行和不使用。 不行。 簡單的輸入按預期工作。 任何想法如何在ctrl + enter上添加回車？

關鍵代碼沒問題。 它們被正確檢測到。 所以如果按預期工作的話。 但添加新行的工作不正確（在FF中，Chrome可正常工作）。 所以我需要正確的多瀏覽器方式將新行符號插入textarea。 如果沒有手動添加字符串（通過基於ctrl + enter的某些事件），它會更好。

更改按鍵事件無效。 “\\ r \\ n”沒有幫助。

測試頁面位於此處

Answer 1

以下內容適用於所有主流瀏覽器，包括IE。 當你按下ctrl-enter時，它的行為就像按下回車鍵一樣：

function MessageTextOnKeyEnter(e) {
    if (e.keyCode == 13) {
        if (e.ctrlKey) {
            var val = this.value;
            if (typeof this.selectionStart == "number" && typeof this.selectionEnd == "number") {
                var start = this.selectionStart;
                this.value = val.slice(0, start) + "\n" + val.slice(this.selectionEnd);
                this.selectionStart = this.selectionEnd = start + 1;
            } else if (document.selection && document.selection.createRange) {
                this.focus();
                var range = document.selection.createRange();
                range.text = "\r\n";
                range.collapse(false);
                range.select();
            }
        }
        return false;
    }
}

Answer 2

一些潛在的原因：

在引用之前定義函數。

確保您在document.ready事件中綁定事件，以便在引用它時存在dom項。

改變else (e.keyCode == 13)到else if (e.keyCode == 13)

確保這是一個textarea ，而不是input[type=text] 。

考慮使用keypress而不是keydown 。

當使用ctrl修飾鍵時，某些瀏覽器將發送keyCode == 10而不是keyCode == 13 （即使您不使用ctrl修飾鍵，某些瀏覽器也會發送它）。

Answer 3

哇屁股什么痛苦。 我已經玩了一段時間了，我不得不假設這只是IE不合作。 無論如何，這是我今天早上能做的最好的，而且它超級黑客，但也許你可以從中獲得一些東西。

解釋：我正在測試ie8，textarea元素和courier new。 結果可能有所不同 ascii character 173（0xAD）不顯示字符，雖然它在移動光標時計為字符。 強制換行后附加此字符即可將光標向下移動。 在調用SendMessage之前，我們用什么都不替換額外的char。

function MessageTextOnKeyEnter(e) 
 { 
    var dummy = "\xAD";
    if (!e.ctrlKey && e.keyCode == 13) 
    { 
        var regex = new RegExp(dummy,"g");
        var newval = $(this).val().replace(regex, '');
        $(this).val(newval);

       SendMessage(); 
       return false; 
    } 
    else if(e.keyCode == 13) 
    { 
       $(this).val($(this).val() + "\n" + dummy); 
    } 
    return true; 
 } 

如果你試圖在每次擊鍵時進行替換，那么它將無法正常工作。 您可以通過白名單/黑名單鍵來處理這個問題，並找到一種方法將光標放回到它應該去的文本中。

Answer 4

我的答案來自Ian Henry關於keyCode == 10的回答，這似乎是IE中的情況（在8和9中測試）。 檢查您是否正在處理Windows事件並鍵入密鑰代碼。

  $('#formID #textareaID').keypress(function(e) {
    if(window.event) {
      var keyCode = window.event.keyCode;     
    }
    else {
      var keyCode = e.keyCode || e.which;
    }

    if( (!e.ctrlKey && (keyCode == 13)) ) {
      //do stuff and submit form
    }
    else if( (e.ctrlKey && (keyCode == 13)) || (keyCode == 10) ) {
      //do stuff and add new line to content
    }                  
  });

Answer 5

你可以檢查ctrl和alt

$(document).ready(function() {
    $('#myinput').keydown(function(e) {
        var keysare = 'key code is: ' + e.which + ' ' + (e.ctrlKey ? 'Ctrl' : '') + ' ' + (e.shiftKey ? 'Shift' : '') + ' ' + (e.altKey ? 'Alt' : '');
        //alert(keysare);
        $('#mycurrentkey').text(keysare);
        return false;
    });
});

在這里查看一個工作示例： http ： //jsfiddle.net/VcyAH/

Answer 6

如果您堅持使用Shift + Enter而不是Ctrl + Enter，則解決方案很簡單。 您不需要任何特殊代碼，因為Shift + Enter會自動觸發換行符。 只需抓住普通Enter即可進行發送。