幾種實現點選修改按鈕可編輯文字,不點則不可編輯的方式
第一種:
<html>
<head><script type="text/JavaScript" language="JavaScript">
function doclick(){
var docs = document.getElementByIdx_x('url');
docs.readOnly = false;
//alert("asdfasd");
}
</script>
</head>
<body>
<input type="text" id="url" name="T_montant" value="com"
<input type="button" value="edit" onclick="doclick();">
</body>
</html>
第二種:
<a id="aText" href="#">編輯文字</a>
<input id="text" type="text" disabled="true" />
var link = document.getElementById("aText");
link.onclick = function(){
link.style.disabled = true;
}
第三種:
<div id="text">文字文字</div>
var id = document.getElementById('text');
var value = id.innerHTML ;
id.onclick = function(){
this.innerHTML = "<input type='text' value='"+text+"' />" ;
}
第四種(經典):
readonly和readOnly有什麼區別:
readonly 屬性規定輸入欄位為只讀。
只讀欄位是不能修改的。不過,使用者仍然可以使用 tab 鍵切換到該欄位,還可以選中或拷貝其文字。
readonly 屬性可以防止使用者對值進行修改,直到滿足某些條件為止(比如選中了一個複選框)。然後,需要使用 JavaScript 消除 readonly 值,將輸入欄位切換到可編輯狀態。
readonly 屬性可與 <input type="text"> 或 <input type="password"> 配合使用。
readOnly 屬性設定或返回文字域是否為只讀。<html>
<body>
<script type="text/javascript">
function kk(){
var gg = document.getElementById("name");
gg.readOnly=false;
}
</script>
<form action="/example/html/form_action.asp" method="get">
<p>Name:<input type="text" name="email" /></p>
<p>Country:<input id="name" type="text" name="country"
value="China" readOnly/></p>
<input type="button" value="修改" onclick="return kk()"/>
<input type="submit" value="Submit"/>
</form>
<p>請在提交按鈕上單擊,輸入會發送到伺服器上名為 "form_action.asp" 的頁面。</p>
</body>
</html>