-1

我的页面循环可编辑和更新的数据库值，无需通过 ajax 刷新。逻辑工作得很好，但我无法让成功消息正确行动。截至目前，消息在所有具有类 .status 的 div 上闪烁...我已经尝试过 prevAll、parents、closest 等，但不能完全让消息仅显示在单击的表单上。

$(document).ready(function() {      
    $(".save").click(function (e) {         
        var content = $(this).prevAll('.editable').html();  
        var item = $(this).prevAll('.item').html(); 

    $.ajax({
        url: 'save.php',
        type: 'POST',
        data: {content: content, item: item},               
        success:function (data) {
            if (data == '1'){
                $(".status")
                .addClass("success")
                .html("Data saved successfully")
                .fadeIn('fast')
                .delay(3000)
                .fadeOut('slow');   
            }
         }
     });        
     });
});

表单结构（请记住，它是循环的）。

<div id="wrap">
    <div class='status'></div>
    <div id='content'>
        <div class='editable' contentEditable='true' ></div>
        <div class="item"></div>    
        <button class="save" style="display:none">Save</button>
    </div>
</div>
4

1 回答 1

1

那是因为您没有指定.status要点亮哪个。

这是一个小提琴。

PS：我更改了一些代码以使其在 jsiddle 中工作，因此您需要适应。

PS2：我建议你使用类名而不是 id，因为我猜它们会重复并且 id 应该是唯一的。

$(document).ready(function() {      
        $(".save").click(function (e) {         
            var content = $(this).prevAll('.editable').html();  
            var item = $(this).prevAll('.item').html();
            var statusItem = $(this).parents('.wrap').find('.status');
        $.ajax({
            url: '/echo/html',
            type: 'POST',
            data: {content: content, item: item},               
            success:function (data) {
                //if (data == '1'){
                     statusItem
                    .addClass("success")
                    .html("Data saved successfully")
                    .fadeIn('fast')
                    .delay(3000)
                    .fadeOut('slow');   
                //}
             }
         });        
         });
    });
于 2012-10-11T01:19:14.833 回答