方法:1、利用“$(input元素)”語句獲取文本框元素對象;2、利用attr()方法設置文本框只讀,將readonly屬性值設置為readonly即可,語法為“文本框元素對象.attr("readonly","readonly")”。
本教程操作環境:windows10系統、jquery3.2.1版本、Dell G3電腦。
jquery怎么設置文本框只讀
1、利用“$(input元素)”語句獲取文本框元素對象
$就是jQuery的別稱
而jQuery就是jQuery庫提供的一個函數.(好像也不僅僅只是函數, 因為還有 $.ajax(options) 這樣的使用,等同 jQuery.ajax(options))
這個函數的作用是根據 () 里的參數進行查找和選擇html文檔中的元素, 函數作用之一就是GetElementByID的代替,但()內不僅可以是ID,還可以是各類選擇器
比如:
$(document)就是 選取整個文檔對象
2、attr方法
attr() 方法設置或返回被選元素的屬性和值。
當該方法用于返回屬性值,則返回第一個匹配元素的值。
當該方法用于設置屬性值,則為匹配元素設置一個或多個屬性/值對。
語法
返回屬性的值:
$(selector).attr(attribute)
設置屬性和值:
$(selector).attr(attribute,value)
readonly 屬性規定輸入字段為只讀。
只讀字段是不能修改的。不過,用戶仍然可以使用 tab 鍵切換到該字段,還可以選中或拷貝其文本。
示例如下:
<html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $('input').attr("readonly","readonly"); }); }); </script> </head> <body> <input type="text" name="FirstName" value="Mickey"> <button>將文本框設置為只讀</button> </body> </html>
輸出結果:
相關視頻教程推薦:jQuery視頻教程