リンクとボタンを並べて配置しています。ユーザーがボタンをクリックすると、リンクのテキストが編集可能になります。
リンクのテキストを編集可能にするために jquery editInPlace を使用しています。リンクのテキストは編集可能になりますが、テキスト編集後にリンク プロパティを復元できません。ここに私のhtmlとjavasrcriptファイルがあります
デモ.js
1 $(document).ready(function(){
2 $("img.modifyButton").click(function(){
3 $(this).prev().editInPlace({
4 success: function(){
5 $(this).unbind('.editInPlace');
6 $(this).unbind('click');
7 },
8 url:'Admin/p.inline_coupon_edit_frontend.php',
9 text_size:55,
10 show_buttons: false,
11 params:"field=Title"
12 });
13
14 $(this).prev().on('click', function(event)
15 {
16 event.preventDefault();
17 });
18 $(this).prev().click();
19 });
20
21 });
htmlファイル
16 <div class="crux">
17 <a href="www.google.com">title</a>
18 <img class="modifyButton" src="./editInPlace_files/modifyButton.png" alt="None" width="13" height="13">
19 </div>
コードの git リポジトリ: git clone https://github.com/VihaanVerma89/dummy.git