検索

ホームページ >ウェブフロントエンド >jsチュートリアル >ajax_javascript スキルなしでテキストをクリックして編集する方法

ajax_javascript スキルなしでテキストをクリックして編集する方法

WBOY
WBOYオリジナル
2016-05-16 19:07:151154ブラウズ

createElement、appendChild、その他の機能は初めてです。ふふ！
専門家にとって、このようなことを書くことは非常に未熟に見えるかもしれません。でも、全部自分で書きました！
まだ完璧ではありませんので、ご指導ください。 ！ " -//W3C//DTD HTML 4.0 暫定版//EN">

スタイル> ; </p> <div class="codetitle"> .test{border:1px Solid #ccc;background-color:#eee;width:200px;height:60px;} <span> </style> <a style="CURSOR: pointer" data="84101" class="copybut" id="copybut84101" onclick="doCopy('code84101')"> <script language="javascript" > ; <U> <!-- </U> function isIE(){ //ie? </a> if (window.navigator.userAgent.indexOf("MSIE")> return true; else return false; </span>} </div>if(!isIE()){ //firefox innerText 定義 <div class="codebody" id="code84101"> HTMLElement.prototype.__defineGetter__("innerText", <BR> function(){ <BR> はこれを返します。 textContent ; <BR> } <BR> ); <BR> HTMLElement.prototype.__defineSetter__("innerText", <BR> function(sText){ <BR> this.textContent=sText; <BR> 🎜>}関数 $( e){ <BR> return document.getElementById(e); <BR> var arr=new Array(); <BR> 関数 check(e){ <BR> var v= 0; (i=0;i<arr.length;i ) <BR> {if(arr[i]==e) v=1; <BR> else v=0;} <BR> if (v) return true; <BR> else return false; <BR> } <BR> function edit(e){ <BR> var x=$(e); <BR> if (check(e) ) <BR> { <BR> //alert("すでに配列内に存在します! "); <BR> //alert(str); <BR> var b=$(e "fa"); <BR> str=$(e "faz").value; <BR> b.removeChild($ (e "faz")); <BR> x.innerText=str; <BR> }else{ <BR> div"); <BR> a1.id=e "fa"; <BR> a=document.createElement ("INPUT"); <BR> a.name=e; <BR> a.value=str; <BR> .appendChild(a1); <BR> a1.appendChild(a); <BR> if(arr.length== 0) arr[0]=e; > //alert(a.name); <BR> } <BR> } <BR> --> <br> </HEAD> <🎜; > <div class="test" id="test" onclick="edit('test')"> 編集可能なコンテンツ</div> <br> <div class="test" id="test1" onclick= "edit('test1')">編集可能なコンテンツ</div> <br> </HTML><br><br><br>ブラウザの問題を解決するための最終コード<br><div class="htmlarea"> <textarea id="runcode92387"> <title> 新しいドキュメント 良い！ ！忙しい夜の後はこれで終わりです！ ！へーへーへー 押し下げられた！ Firefox では、DOM の小さな違いにより、タグ 内のスペースを除く入力が含まれる div になります。 childNodes[0] を使用しているため、スペースは使用できません。それ以外の場合は、2 回クリックする必要があります。

編集可能なコンテンツ 1
編集可能なコンテンツ 2
編集可能なコンテンツ 3
編集可能なコンテンツ 4

[Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、
を実行するために更新する必要があります]
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：JavaScript_javascript スキルで名前空間を作成する最も簡単な実装次の記事：JavaScript_javascript スキルで名前空間を作成する最も簡単な実装

関連記事

続きを見る