3

我正在尝试为我的菜单编辑器创建一个编辑功能。我得到正确的值，将它们放在表单文本框中，然后尝试用新文本替换当前文本。

首先，用户单击“编辑”按钮，调用此函数：

$(".edit").click(function(){
        $(this).addClass("editing");
        var menulink = $(this).next().find('a').attr('href');
        var menudisplay = $(this).next().find('a:first').text();
        $("#editlink").val(menulink);
        $("#editdisplay").val(menudisplay);
    });

然后表单显示在一个弹出框中，其中插入了值：

<div id="edit-box" class="login-popup">
        <a href="#" class="close"><img src="../../../images/close5.png" class="btn_close" title="Close Window" alt="Close" /></a>
        Enter the link for the menu item: <input type="text" id="editlink" /><br />
        Enter the text to display: <input type="text" id="editdisplay" /><br />
        <button id="saveEdit">Save Menu Item</button>
    </div>

然后用户单击保存按钮并调用此函数：

$("#saveEdit").click(function(){
    var editlink = $("#editlink").val();
    var editdisplay = $("#editdisplay").val();
    **/* REPLACE THE CURRENT INFORMATION WITH THE NEW INFORMATION */**
    $('#mask, .login-popup').fadeOut(300 , function() {
        $(".edit").removeClass("editing");
        $('#mask').remove();  
    }); 
    $('.tree_item').each(function(){
        $(".delete, .edit").remove();
    });
    $.post('edit-menu-process.php', 
        {tree: $('#nav').html()}, 
        function(data){$("#printOut").html(data);}
    );
    alert("Menu item has been edited.");
    location.reload();
});

我无法替换列表项的正确部分。我已将需要为其编写代码的区域加粗。这个函数的其余部分是获取新值，去掉掩码、类和按钮，发布到保存过程，并重新加载页面。任何指导将不胜感激。

列表项的示例：

<li class="tree_item"><span><a href="index.php" class="menulink">Home</a></span></li>
4

2 回答 2

0

我已经能够找到一种方法来使它工作。由于.text似乎删除了li标签之间的所有内容，我可以使用变量替换所有内容。 $(".editing").next().text('<span><a href="'+editlink+'" class="menulink">'+editdisplay+'</a></span>');

于 2013-07-07T20:55:43.907 回答
0

假设显示的代码在同一个命名空间中（如果它不是全局的，则加分：））您可以通过简单地在该公共命名空间中声明一个变量并在第一个处理程序中分配 jQuery 对象来做到这一点。

当用户现在单击编辑时，他们被分配并且也可以在您的第二个处理程序中访问。

(function ($, window, undefined) {
    var $link;

    $(".edit").click(function(){
        var $this = $(this);

        $link = $this.next().find('a:first').attr('href');
        var menulink    = $link.attr('href');
        var menudisplay = $link.text();

        $this.addClass("editing");

        $("#editlink").val(menulink);
        $("#editdisplay").val(menudisplay);
    });

    $("#saveEdit").click(function(){
        var editlink = $("#editlink").val();
        var editdisplay = $("#editdisplay").val();

        // Update href attr and text of your link
        $link.attr('href', editlink);
        $link.text(editdisplay);

        $('#mask, .login-popup').fadeOut(300 , function() {
            $(".edit").removeClass("editing");
            $('#mask').remove();  
        }); 
        $('.tree_item').each(function(){
            $(".delete, .edit").remove();
        });
        $.post('edit-menu-process.php', 
            {tree: $('#nav').html()}, 
            function(data){$("#printOut").html(data);}
        );
        alert("Menu item has been edited.");
        location.reload();
    });
}(jQuery, this))

OT：你应该尽量避免 跳池

于 2013-07-07T21:02:01.697 回答