###実現したいこと
HTMLのcontenteditable="true"
について、この中にある.icon
を削除できないようにしたい。(.icon
は必ず最後に来ます。)
HTMl
1<h2> 2 <span class="txt" contenteditable="true">Hello<span class="icon">★</span></span> 3</h2> 4<h2> 5 <span class="txt" contenteditable="true">World</span> 6</h2>
###試したこと
思いついたのはこの2つの条件で、これができれば.icon
は削除できなくなるのではないか?と考えました。
➀もし.icon
があり、キャレットが.icon
の後ろ(最後)にあるときは、キャレット位置を.icon
の手前(最後から2番目)に移動する。
➁もし.icon
があり、キャレットが最後から2番目のときは、デリートが押せない。
しかしその正しい書き方がわからず、質問させて頂きます。
###該当のソースコード
こちらが自分なりに考えてみたものですが、エラーもでず、キャレット位置の情報が検索してもあまりなく、これ以上わからない状況です。
jQuery
1$(function(){ 2 $('h2').on('click',function(){ 3 if( $(this).find('span').hasClass('icon') ){ 4 var form = $(this).find('.txt').get(0); 5 var carretto = form.selectionEnd; 6 // ➀キャレットが最後のときは、最後から2番目に移動 7 if( carretto == 0 ){ 8 form.selectionEnd = 1; 9 } 10 // ➁キャレットが最後から2番目のときは、デリートが押せない 11 if( carretto == 1 ){ 12 if(e.keyCode == 46){ 13 return false; 14 } 15 } 16 } 17 }); 18});
また、もし上の➀や➁以外の方法で実現したいことが可能であれば、その方法も教えていただきたく思います。
どうぞよろしくお願い致します。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/04/05 22:07 編集
退会済みユーザー
2019/04/06 02:37
2019/04/06 03:21
退会済みユーザー
2019/04/06 06:36
退会済みユーザー
2019/04/06 06:40
2019/04/06 06:51
退会済みユーザー
2019/04/06 07:03