思路一：監聽input框的onkeyup和onkeydown事件
<input
type
="text"
onkeydown
="this.onkeyup();"
onkeyup
="this.size=(this.value.length>4?this.value.length:4);"
size
="4"
>
以上是理應input的size屬性來控制input的寬度的
思路二：propertychange監聽input裡面的字元變化,屬性改變事件
<input
class
="aa"
type
="text"
value id
="a"
name
="ss"
>
來點》我1
<
input
class
="aa"
type
="text"
value id
="s"
name
="ss"
/>
來點/>我2
<
input
class
="aa"
type
="text"
value id
="d"
name
="ss"
>來點<>我3
input
>
<
script
>
$(function
());
})script
>
思路三：比較靠譜的方法（也存在問題）
//獲取文字寬度var textwidth = function(text));
var width = sensor.width();
sensor.remove();
return width;
};//input寬度自適應
$("input").unbind('keydown').bind('keydown', function());
也就是說，在使用系統預設字型、設定font-size相同的情況下，乙個漢字佔乙個font-size的大小，乙個字母佔半個font-size的大小，而數字佔font-size的大小不知道是啥規律，既不是乙個也不是半個font-size，但是在input中實際顯示佔的位置卻不一樣
如果是中英文混雜，效果就差強人意（計算的寬度很不準確）。
要設定好css的字型大小和字型family，我目前發現宋體中字母和數字都遵循寬度和實際佔位都是半個font-size，所以暫且使用字型為宋體，但宋體不太好看，其他字型還有待測試
jquery計算文字寬度的原理是利用html提供的標籤，向dom中動態新增標籤，標籤裡的內容就是要測試長度的文字，獲取完長度之後再刪除剛才新增的標籤，從而可取到文字的大概長度了。為什麼要用標籤而不用其他標籤呢，那來看看標籤的特性吧：pre 元素可定義預格式化的文字。被包圍在 pre 元素中的文字通常會保留空格和換行符;而文字也會呈現為等寬字型。標籤的乙個常見應用就是用來表示計算機的源**。需要注意的地方是，計算文字長度時文字裡面最好不要有其他標籤。以下是實現**：可以直接複製引入jq看效果
doctype html
>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
meta
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
<
title
>document
title
>
<
script
src=""
>
script
>
head
>
<
style
>
input
prestyle
>
<
body
>
<
input
type
="text"
value
="ffsdfs"
>
<
script
>$("
input
").unbind(
"input
").bind(
"input",
function
())
//獲取文字寬度
vartextwidth
=function
(text));
$('body
'
varwidth
=sensor.width();
sensor.remove();
return
width;
};//初始化時獲取文字寬度 自己加的$("
input
").width(textwidth($(
"input
").val()))
script
>
body
>
html
>
根據自己的需求可以靈活運用
input 只能輸入特定字元
去除歷史記錄 autocomplete off 輸入中文 數字 英文 輸入數字和字母 輸入大小寫字母 數字 下劃線 只能輸入英文本母和數字,不能輸入中文 只能輸入數字和英文 輸入小寫字母 數字 下劃線 輸入數字和點 輸入中文 輸入數字 輸入英文 除了英文的標點符號以外，其他的都可以中文，英文本母，數...
js控制input輸入字元解析
enter鍵可以讓游標移到下乙個輸入框 只能是中文 遮蔽輸入法 只能輸入英文和數字 只能是數字 只能顯示，不能修改 只能輸數字，判斷按鍵的值 複製 如下 1.文字框只能輸入數字 小數點也不能輸入 2.只能輸入數字,能輸小數點.3.數字和小數點方法二 4.只能輸入字母和漢字 5.只能輸入英文本母和數字...
Input標籤禁用與Css動態樣式繫結
input標籤存在乙個disabled屬性，可以用來禁用此標籤，通常還可以對這個屬性進行禁用後的樣式修改 一般裡面對應乙個bool屬性，表示是否禁用標籤，而樣式修改可以在css中自己設定 通常寫法如下例所示 input disabled class指令只能繫結要給css類 class.樣式類名稱 布...