javascript - 将输入转换为jquery中的链接

标签 javascript jquery jquery-ui

目前脚本是这样的:

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

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

这是脚本:

jsfiddle - CODE

最佳答案

<罢工> 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

关于javascript - 将输入转换为jquery中的链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11160426/

相关文章:

被拖动项目的 jQuery Id

javascript - Jquery 找不到带有 '+' 的类

javascript - Jquery:如何在没有有效 href 的情况下打开 window.open()?

javascript - jQuery 可以点击调用悬停函数吗?

JQuery拖放-droppable包含draggable

javascript - React map 函数混淆

javascript createElement 和 setAttribute

javascript - 在函数中传递 $scope 变量不会改变

javascript - 在 javascript 中为除特定密码模式之外的所有内容编写正则表达式

jquery - 更改 JQuery DatePicker 中的 minDate 选项不会执行任何操作