在取消时隐藏输入元素

时间:2013-09-14 16:23:47

标签: javascript jquery ajax forms

Ι有一个表单,其中有一个输入元素,用户可以在其中输入网址 - 当他点击编辑按钮时会发生这种情况,此时输入字段就会出现。

如果用户开始键入url并单击取消按钮,那么他输入的内容将变为null,并且输入字段将再次从视图中隐藏(类将添加到具有display:none的元素中)。

这就是出现问题的地方: 如果用户键入内容并单击“保存”按钮,则会使用ajax请求将数据(url)发送到服务器。这意味着下次加载表单时,用户将看到提交的URL。如果,在那时选择编辑表单,并按下取消按钮,提交的网址将被隐藏起来......当然,这是不可取的,因为我们在这里谈论提交的数据。

我如何区分这一个, - 提交的数据和未提交的数据 - 取消。

这是一些代码,首先与单击取消按钮有关,其次是将函数添加到输入元素的函数:

$('#canceladrs').click(function() {  
var urlcancel=$.trim($('input#wwwaddress').val());
save=2;
close_url(save,urlcancel);       
closeaddress(); 

});

here is the close_url() function

function close_url(savearg,urlarg,cancelarg)
{
console.log(urlarg);
if(savearg===1)// save button clicking here
    { if(urlarg==='')
            {
              $('input#wwwaddress').addClass('hideurl');
              $('label[for=url]').addClass('hideurl');
              $('input#wwwaddress').val(null);
            } 
       else if(urlarg!=='')
           {
              $('input#wwwaddress').removeClass('hideurl');
              $('label[for=url]').removeClass('hideurl');
              $('input#wwwaddress').val(urlarg);
           }
    }
else if(savearg===2)//cancel button clicking here
{if((urlarg!=='')||(urlarg===''))
        {
            $('input#wwwaddress').addClass('hideurl');
              $('label[for=url]').addClass('hideurl');

        }
}


}

}

如上所示,我试图标记点击取消按钮设置save = 2。

1 个答案:

答案 0 :(得分:1)

好的,根据你的评论,如果输入中有文字,你不想隐藏输入。在这种情况下,请允许我参考您提供的代码片段:

if((urlarg!=='')||(urlarg==='')){
            $('input#wwwaddress').addClass('hideurl');
            $('label[for=url]').addClass('hideurl');
}

此处的逻辑显示urlarg是否没有值,或者urlarg是否有值添加隐藏输入和标签的类。

因此,您在所有情况下都隐藏了输入和标签。

如果您不想在有内容时隐藏输入元素,请不要添加urlarg !== ''条件。

我还建议为取消和保存事件添加单独的事件处理程序,这样您就不必向函数发送save等特殊信号。

另外,正如我所提到的,jquery已经有hide,不需要自己做。

最后,你可能想要修剪你的urlarg字符串,因为如果用户只输入一个空格,那根本没有价值,但是你的脚本会把它视为有值。