在输入字段旁边显示成功保存的消息答案

【问题标题】：Show succesfully saved message next to the input field在输入字段旁边显示成功保存的消息
【发布时间】：2013-03-17 08:49:57
【问题描述】：

我有一个表单，它切换了编辑和保存按钮以使输入框可编辑和禁用。

这里我需要的是在输入框旁边添加一条成功消息。

HTML

<form>
        <label>First Name</label>
    <input type="text" placeholder="Lorem" readonly required  /><input name="Edit" type="button" value="Edit"> <span class="alert">test</span>
        <label>First Name</label>
        <input type="text" placeholder="Lorem" required readonly /><input name="Edit" type="button" value="Edit">
        <label>Email ID</label>
        <input type="email" placeholder="Lorem" required readonly /><input name="Edit" type="button" value="Edit">
        <label>Password</label>
        <input type="password" placeholder="********" required readonly /><input name="Edit" type="Button" value="Edit">
      </form>

脚本

$('[name="Edit"]').on('click', function() {
    var prev = $(this).prev('input'),
        ro   = prev.prop('readonly');
    prev.prop('readonly', !ro).focus();
    $(this).val(ro ? 'Save' : 'Edit');
    $(".alert").fade();
});

这里是fiddle。

这就是我需要在保存时显示消息的方式

【问题讨论】：

标签： jquery css toggle textinput

【解决方案1】：

试试这个：

 $('[name="Edit"]').on('click', function() {

        if($(this).val()=='Save')
        {
        $(".alert").fadeIn();    
        }
        var prev = $(this).prev('input'),
            ro   = prev.prop('readonly');
        prev.prop('readonly', !ro).focus();
        $(this).val(ro ? 'Save' : 'Edit');

    });

【讨论】：

【解决方案2】：

变化：

$(".alert").fade();

收件人：

$(".alert").fadeIn();

【讨论】：