jquery editInPlace锚文本编辑

时间:2013-09-27 12:22:09

标签: javascript jquery edit-in-place

我有一个链接和一个按钮并排放置。当用户点击按钮时,链接的文本应该可以编辑。

enter image description here

我使用jquery editInPlace来使链接的文本可编辑。链接的文本变得可编辑,但我无法在文本编辑后恢复链接属性。 这是我的html和javasrcript文件

demo.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 repo of code:git clone https://github.com/VihaanVerma89/dummy.git

1 个答案:

答案 0 :(得分:4)

不确定你的问题是什么。你的php文件是空的,但是当使用回调而不是你的PHP文件时,一切似乎都正常 - 链接目标是完整的。

您的版本出了什么问题?你是从PHP文件返回值吗?如果没有,这将失败我相信

http://jsfiddle.net/raNFr/2/

这似乎工作得很好,除非我错过了你想要做的事情:

$(document).ready(function(){
    $("img.modifyButton").click(function(){
        $(this).prev().editInPlace({
            success: function(){
                $(this).unbind('.editInPlace');
                $(this).unbind('click');
            //  alert('success');
            },
            error: function(){
                $(this).unbind('.editInPlace');
                $(this).unbind('click');
                //alert('error');
            },

            callback: function(b,abc){
                return abc;
            },
            text_size:55,
            show_buttons: false
            ,params:"field=Title"
        });

        $(this).prev().on('click', function(event)
                {
                    event.preventDefault();
                });
        $(this).prev().click();
    });

});

我认为问题在于你的php脚本 - 上面的工作就像你的例子一样,不包括php - 因为它没有包含在你的git repo中。