رمز HTML العقدة كما يلي:
نسخة الكود كما يلي:
<div id = "img_1">
<type type = "image" src = "img/cump.png"> </pected>
<div id = "notetxt" type = "text" ondblclick = "changename (this.id) ؛"> 123 </viv>
</div>
JS Edit Notetxt Text ، الوظيفة هي كما يلي:
نسخة الكود كما يلي:
وظيفة changename (notetxtid) {
var notetxt = document.getElementById (notetxtid) ؛
notetxt.style.display = "none" ؛ //. style.display = "block"
var div = notetxt.parentNode ؛
if (! document.getElementById ("noteInput")) {
var text = document.createElement ("input") ؛
text.type = "text" ؛
text.id = "noteInput" ؛
text.style.width = getStyle (notetxt ، 'width') ؛
text.style.height = getStyle (notetxt ، 'height') ؛
text.style.margintop = getStyle (notetxt ، 'margintop') ؛
text.style.textalign = getStyle (notetxt ، 'textalign') ؛
text.value = notetxt.innerhtml ؛
div.AppendChild (text) ؛
text.select () ؛
text.onblur = function () {
notetxt.style.display = "block" ؛
notetxt.innerhtml = text.value ؛
//text.style.display= "لا شيء" ؛
div.removechild (نص) ؛
}
}
}
// احصل على النمط في ملف CSS
وظيفة getStyle (OBJ ، att)
{
إذا (OBJ.CurrentStyle)
{
إرجاع OBJ.CurrentStyle [attr] ؛ //أي
}آخر{
إرجاع getComputedStyle (OBJ ، خطأ) [attr] ؛ // ff
}
}
CSS كما يلي:
نسخة الكود كما يلي:
.img_1 {
العرض: 80px ؛
الارتفاع: 70 بكسل ؛
الموقف: مطلق ؛
}
.NTETEXT {
العرض: 80px ؛
الارتفاع: 15 بكسل ؛
محاذاة النص: المركز ؛
الهامش: 70 بكسل ؛
الكلمة كسر: كسر الكل ؛
}
الكود بسيط للغاية ، لذلك لن أشرحه هنا. يمكن للأصدقاء استخدامه بحرية واستخدامه في مشاريعهم الخاصة.