也需要为“加载”调用脚本，而不仅仅是在“模糊”上

need the script to be called for "onload" too not just on "blur"

本文关键字：不仅仅是 模糊 调用 加载 脚本      更新时间：2023-09-26

代码为：

$(document).ready(function () {
$('#url0, #url1, #url2, #url3, #url4, #url5, #url6, #url7, #url8, #url9, #url10').each(function(index, element) {
    $(element).blur(function() {
        var vals = this.value.split(/'s+/);
        var $container = $(this).hide().prev().show().empty();
        $.each(vals, function(i, val) {
            if (i > 0) {
                $("<span> </span>").appendTo($container);
            }
            $("<a />")
                .html(val)
                .attr('href',/^https?:'/'//.test(val) ? val : 'http://' + val)
                .appendTo($container)
                .click(handleClickEvent);
        });
    });
}).trigger('blur');
// ms to wait for a doubleclick
var doubleClickThreshold = 300;
// timeout container
var clickTimeout;
$('.aCustomDiv a').click(handleClickEvent);
$('.aCustomDiv').click(handleDivClick);
function handleClickEvent(e) {
    var that = this;
    var event;
    if (clickTimeout) {
        try {
 clearTimeout(clickTimeout);
        } catch(x) {};
        clickTimeout = null;
        handleDoubleClick.call(that, e);
        return false;
    }
    clickTimeout = setTimeout(function() {
        clickTimeout = null;
        handleClick.call(that, event);
    }, doubleClickThreshold);
    return false;
}
function handleDivClick(e) {
    var $this = $(this);
    $this.parent()
        .find('input,textarea')
        .show()
        .focus();
    $this.hide();
}
function handleDoubleClick(e) {
    var $this = $(this).parent();
 $this.parent()
        .find('input,textarea')
        //.val($a.text())
        .show()
        .focus();
    $this.hide();
}
function handleClick(e) {
    window.open(this.href, '_blank')
}
});

网页代码：

<div style="padding:0 !important;margin-top:8px !important;">
<div class="aCustomDiv" style="padding: 0px ! important; display: block;">
    <a href="http://www.google.com">www.google.com</a><span></span><a href="http://www.facebook.com">www.facebook.com</a><span></span><a href="http://www.wikipedia.org">www.wikipedia.org</a>
</div>
<input type="text" value="www.google.com www.facebook.com www.wikipedia.org" onchange="immediateEditItemInCart(this.value,'url',0,'pr','35')" class="mandatory0" id="url0" style="display: none;" readonly="readonly">

此脚本执行以下操作：

  1. 将文本转换为这些 ID 的 URL （url0 ...
  2. 双击链接使其可编辑
  3. 单击div区域，链接旁边使其可编辑
  4. 单击链接 => 转到页面

我的问题：由于某种原因我不知道，单击链接不会转到页面，而是对其进行编辑，只有第一次，之后效果很好，所以我希望调用第一个函数也加载，不仅在模糊时。 我该怎么做？

就启动时加载而言，javascript 是单线程的，因此如果您保持有序（...只需添加几个参数）。 但是因为你试图访问 DOM，所以你确实想等待元素可用（否则你不会从选择器得到任何回报）。

但您已经拥有：

$(document).ready( function(){} );

它完全符合您的要求，它还具有以下简写：

$( function(){} );

所以我必须同意 rodneyrehm 的观点，这可能是您与页面上的其他 js 发生的一些冲突。 您可能希望将其封装在某个命名空间中，以确保这不是问题所在。

我写了一个快速版本，如果你仍然遇到问题，它应该让你走上你的路作为起点：http://jsfiddle.net/scispear/dUWwB/。 我拉出了"updateURL"方法，以防您的 ajax 调用（您提到）只是预填充字段（这样您也可以传入值）。

它也适用于多个输入/显示，我认为您要的不是 100% 确定的。

相关文章：