如何在JS中動態插入字符的中間輸入文字

我有一個輸入文本框來填寫00:00到23:59的小時我想動態插入2之後的雙點「：」第一個字符，就像在http://www.railtime.be/website/home-fr，它甚至給出錯誤信息，如30:66給出了錯誤的小時數......我無法弄清楚它是如何完成的，任何想法？如何在JS中動態插入字符的中間輸入文字

<input type="text" name="time" id="time" placeholder="00:00" maxlength="5" value="">

我認爲一個按鍵功能已被使用，但是有什麼用？在此先感謝！

解決了與dfsq解決方案：

$('input#time').on('keyup', function(e) { 
    if (e.which && this.value.length === 2 && e.which !== 8) { 
     this.value += ':'; 
    } 
});

來源

2015-03-13 Snipchain

爲什麼不使用''？ – j08691 2015-03-13 14:46:42

http://jsfiddle.net/6rajxg5a/您還將處理粘貼事件。 – dfsq 2015-03-13 14:53:18

感謝您的幫助dfsq！ :) j08691：因爲兼容性原因，我沒有使用type = time，所以它不適用於IE和FF，不幸的是... – Snipchain 2015-03-13 15:04:42

這可能會幫助你。 http://jsfiddle.net/e2DzT/380/

它檢查正確的格式，如果它是空的。它會輸出正確的迴應。格式只能在15:30格式。

當找到正確的格式時，表單被提交。

<form id="login" name="login" method="post" action="#">

只需將其更改爲您想要的功能即可。

來源

2015-03-13 15:11:22 Aotik

它可能還應該對值8：8給出驗證警告。失去？在分鐘部分。 – blablabla 2015-03-13 15:18:46

<input type="time">如果你希望避免的jQuery，只是用這個簡單的代碼是不是在Firefox等支持，其中的「：」將在使用KEYUP事件 -

<html> 
<head> 
<script type="text/javascript"> 
function insertColon(e){ 
    var unicode=e.keyCode? e.keyCode : e.charCode 
    if(unicode!=8){// this avoids backspace to spoil your logic 
     var textval=document.getElementById("time").value; 
     if(textval.length==3&&textval.charAt(1)!=":"&&textval.charAt(2)!=":"){// this case arises when backspace is used 
      textval=textval.substring(0,2)+":"+textval.substring(2,3); 
      document.getElementById("time").value=textval; 
     } 
     else if(textval.length==2&&textval.charAt(1)!=":"){// normal case 
      textval=textval+":"; 
      document.getElementById("time").value=textval; 
     } 
    } 
    else if(unicode==46&&textval.length>=3&&textval.charAt(1)!=":"&&textval.charAt(2)!=":"){ 
    textval=textval.substring(0,2)+":"+textval.substring(2);`document.getElementById("time").value=textval;` 
} 

} 
</script> 
</head> 
<body>  
<input type="text" name="time" id="time" placeholder="00:00" maxlength="5" value="" onKeyup="insertColon(event);">  
</body> 
</html>

打字本身的時間插入

您可以自己添加一些小腳本代碼來檢查小時和分鐘的範圍是否落入範圍內。

來源

2015-03-13 15:21:13 Vivek

你可以試試下面的JavaScript代碼：

function appendColon(){ 
 
    var time=document.getElementById("time").value; 
 
    var hours=time.substring(0, 2); 
 
    var minutes=time.substring(2, 4); 
 
    document.getElementById("time").value=hours+":"+minutes; 
 
}

<input type="text" name="time" id="time" onchange="appendColon()" placeholder="00:00" maxlength="5" value="">

在輸入的onchange事件，小時和分鐘之間追加:。

來源

2015-03-13 15:24:13

如何在JS中動態插入字符的中間輸入文字

回答

相關問題