在jquery中将输入转换为链接答案

【问题标题】：convert input to link in jquery在jquery中将输入转换为链接
【发布时间】：2012-06-22 16:33:13
【问题描述】：

目前脚本是这样的：

点击链接编辑链接，使输入可见
点击下一步/在链接之前通过使输入可见来编辑链接

我希望当您单击一次链接时不要编辑而是在新窗口中打开页面，并且当您单击两次时进行编辑。

这是脚本：

jsfiddle - CODE

【问题讨论】：

用dblclick()替换.click()?

标签： javascript jquery jquery-ui

【解决方案1】：

~~http://jsfiddle.net/jaspermogg/pFyNY/1/ - 您可以双击 div 进行编辑，或单击链接打开。这就是你想要的？~~

$('.a0').dblclick(function(e){
    e.preventDefault();
    $(this).parent().find('input').val($(this).find('a').text()).show().focus();
    $(this).hide();
})

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

这是一个 jsFiddle，它将 a 的 href 更改为您将其编辑为的值，以防万一您接下来要尝试这样做:-) http://jsfiddle.net/jaspermogg/pFyNY/2/

这是你想要的 jsFiddle - http://jsfiddle.net/jaspermogg/pFyNY/5/

JS-

$('.a0 a').click(function(){

    var href = $(this).attr('href');

    // Redirect only after 500 milliseconds (CHANGE THE 500 IN THE CODE TO DETERMINE HOW LONG THE USER GETS TO DBLCLICK)
    if (!$(this).data('timer')) {
       $(this).data('timer', setTimeout(function () {
          window.location = href;
       }, 500));
    }
    return false; // Prevent default action (redirecting)
});

$('.a0').dblclick(function(){
    clearTimeout($(this).find('a').data('timer'));
    $(this).find('a').data('timer', null);

    $(this).parent().find('input').val($(this).find('a').text()).show().focus();
    $(this).hide();
})

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

灵感来自Jquery create Double Click event on A Href

【讨论】：

不，想要双击链接或单击 div 区域进行编辑，当单击链接转到该页面时，此刻我看到双击编辑它但是也去页面，不用一键编辑div的东西
已编辑以包含您的功能。
非常适合双击但是在div区域上一键没有编辑动作，其他的一切都很棒和完美只需要在div区域上单击一下就可以编辑了，就这样，非常感谢
你真的了解 jQuery 吗？ :-)
这很酷，对我来说太拖延了！你也让我学习，所以谢谢你。

【解决方案2】：

使用target="_blank" 属性在新页面中打开链接。

<a target="_blank" href="dsad.cas">dsad.cas</a>

并使用jquery的.dblclick函数编辑链接

$('.a0').dblclick(function(e){
    e.preventDefault();
    $(this).parent().find('input').val($(this).find('a').text()).show().focus();
    $(this).hide();
})

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

这里是Demo

【讨论】：

nope :) ，这不是我想做的，我想一键点击 div 区域并双击链接进行编辑，也点击链接进入页面