解析嵌套html标记中的文本以进行内联编辑

时间:2013-06-01 06:35:09

标签: php jquery html parsing dom

在搜索我的查询后,我在这里发布此问题... 我正在研究内联编辑脚本...... 我希望在带有保存和取消选项的模态框上点击任何html标签之间的文本,以便可以编辑...这些值也可以使用php脚本发送到数据库

我使用过jquery .text& .html函数用于获取格式

的标记值
<p>Some text</p>

但是当格式类似

时,我无法编辑该值
<p>This is a <a href="#">Sample</a> <b>text</b></p>

我的Jquery代码是:

$("#diag-wrap").hide();
        $("span,p,h1,h2,h3,h4,h5,h6,li,a").click(function(){
            $(this).addClass('edit');
            ss = $('.edit').text();
            //alert(ss);
            $("#diag-wrap").show();
            $("#show").html('<textarea id="test" cols="50" rows="15">'+ss+'</textarea>');       
            $("#test").htmlarea();
        });//click end


    $("#save").click(function(){
        var edited = $("#test").val();
        //alert(edited);
        $.post("bounce-back.php",{
            edited:edited, 
            old:ss}, function(data,success){
            //alert(data);
            $('.edit').html(data);
            $('*').removeClass('edit');
            $("#diag-wrap").hide();
            });
    });

    $("#cancel").click(function(){
            $('*').removeClass('edit');
            $("#diag-wrap").hide();
    });

bounce-back.php中的代码

$old_val= $_POST['old'];
echo $edited_val= $_POST['edited'];
$qur= mysql_query("insert into edit (old, new) values('$old_val', '$edited_val')");

这是HTML弹出代码,如果它无论如何都有帮助......

<div id="diag-wrap" style="position:absolute; width:100%; height:100%; background-color:#999; opacity:0.7; top:0px;"> <div id="wrap" style="width:500px; height:500px; margin:auto;"> <div id="show" style="width:419px; border:2px solid #000; background-color:#FFF;"> </div> <button id="save">Save</button><button id="cancel">Cancel</button> </div> </div>

请帮助我找到可行的解决方案......

0 个答案:

没有答案