javascript - 如何处理 jQuery 中锚的文本值更改为“”的情况？

Question

这是代码：Jsfiddle

1. 我有一个表单，a可以通过 dblclicking 链接来编辑文本值，或者在里面div单击a。
2. Onblur，1.中的条件所显示的输入框中的值被赋值给文本值a。

问题：当您将输入留空并对其进行模糊处理时，它会将a' 的文本设置为"". 在这一点上div，它的周围崩溃并且用户无法访问。

我怎样才能防止这种崩溃发生？

Answer 1

只要这样做，你的问题就会得到解决。

在模糊时，只需检查值长度为零，然后显示输入字段，否则显示超链接。

$('#url0, #url1').each(
    function(index, element){
        $(element).blur(function(){
            if ($(this).val().length == 0)
                $(this).show();
            else
                $(this).hide().prev().show().find('a').html(this.value);
        });
    }    
);

参考这个LIVE DEMO

Answer 2

这位小伙伴呢？

http://jsfiddle.net/jaspermogg/EdtC2/4/

$('#url0, #url1').each(
    function(index, element){
        $(element).blur(function(){
        this.value == "" ? $(this).hide().prev().show().find('a').html("[insert text here]") : $(this).hide().prev().show().find('a').html(this.value);
    })
    }    
);

如果输入框为空，则将其设置a为“[在此处插入文本]”。还是您想要一种实际上不可见的情况？如果是这种情况，您可以随时更改文本颜色以匹配背景，例如？

Answer 3

根本不是错误。你的a标签是空的，它崩溃了。

看这个演示看看。您需要在其上设置一些 css 以使其不会崩溃。例如，边框使其按预期工作。添加填充或边距也可以。使其显示 inline-block 也可以修复它，而无需任何额外的边框、填充或边距。

.a0 a {
    display: inline-block;
}​

Answer 4

试试这个。

我只是添加了一个边框、默认宽度和高度，以便即使在删除输入后 div 也是可见/可点击的。您可能不需要这样做。