僅在預先指定的按鍵組合

我想提供標記就像在我的文本框功能添加一個新的標籤，通過以下＃1我下載並在我的ASP.NET Web文件夾添加http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js文件，我可以使用它的所有功能都是通過我的js功能實現的。僅在預先指定的按鍵組合

我痛苦着的問題是因爲在我的js代碼的事件（事件的內容）的，按照目前我需要做一個對（「事件的內容」）事件在我的搜索框中添加一個標籤。我已經添加HTML和CSS代碼也和他們就好了，我的問題是Javascript代碼
代碼：
HTML：

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<meta charset=utf-8 /> 
<title>JS Bin</title> 
</head> 
<body> 
    <div id="tags"> 
    <input type="text" id="search" /> 
    </div> 
</body> 
</html>

CSS：

#tags{ 
    float:left; 
    border:1px solid #ccc; 
    padding:5px; 
    font-family:Arial; 
} 
#tags span.tag{ 
    cursor:pointer; 
    display:block; 
    float:left; 
    color:#000; 
    background:#eee; 
    padding:5px; 
    padding-right:25px; 
    margin:4px; 
} 
#tags span.tag:hover{ 
    opacity:0.7; 
} 
#tags span.tag:after{ 
position:absolute; 
content:"x"; 
border:1px solid; 
padding:0 4px; 
margin:3px 0 10px 5px; 
font-size:10px; 
} 
#tags input{ 
    background:#fff; 
    border:0; 
    margin:4px; 
    padding:7px; 
    width:auto; 
} 
#search{ 
    background:#fff; 
    border: 0px; 
    width:auto; 
    height:auto; 
}

JS：

$('#tags input').on('focusout',function(){  
    var txt= $.trim($(this).val()); 
    if(txt){ 
    $("#search").before('<span class="tag">'+txt+'</span>'); 
    } 
    $(this).prop('value',''); 
}); 


$('#tags').on('click','.tag',function(){ 
    $(this).remove(); 
});

問題：

我不希望我的用戶點擊外，每次用戶想增加一個標籤，我想的 Ctrl + Enter組合鍵，使之更容易，而。我怎樣才能做到這一點？

來源

2013-08-16 navin

與事件替換您focusout事件：

$('#tags input').keydown(function (e) { 
    if(e.ctrlKey && e.keyCode == 13) { 
     var txt= $.trim($(this).val()); 
     if(txt){ 
     $("#search").before('<span class="tag">'+txt+'</span>'); 
     } 
     $(this).prop('value',''); 
    } 
});

說明：您檢查您的Event對象，以查看是否已按下Ctrl鍵：

if(e.ctrlKey

而且檢查什麼在壓制在同一時間（圖13是用於Ctrl鍵的鍵碼）：

if(e.ctrlKey && e.keyCode == 13) {

如果兩個陳述是真實的，那麼你可以假設你的用戶已經按下Ctrl鍵+輸入組合。

的jsfiddle演示：http://jsfiddle.net/losnir/FxQ62/

來源

2013-08-16 14:41:50 losnir

我還以爲我還需要KeyUp事件..好吧讓我試試 – navin

它的偉大工程，檢查我的jsfiddle。如果你仍然有問題，然後描述它們。 – losnir

，我真的很抱歉，這是我的錯，我忘了你的代碼來更新我的代碼....是......這是現在的工作，感謝 – navin

僅在預先指定的按鍵組合

回答

相關問題